Code:-: Object 1

Object 1 :- Write simple html program’s to view the architechture of program.
Code:-
<html>
<head>Welcome to the HTML tutorial</head>
<title> Rajesh Kumar</title>
<body></body>
</html>
Output :-
Object 2 :- Write html program to the write some peragraph.
Code :-
<html>
<head><title>Rajesh Kumar</title></head>
<body>
<p>I'm Rajesh Kumar from bca third year student. My hobby is codding,watch
movies and playing virtual games.<br>Eleven students are my class and two feculty
are tech in all subjects.<br>My Project is E learning.</p>
</body>
</html>
Output :-
Object 3 :- Write html program to print address,city,state and pin code.
Code :-
<html>
<head> <title>RAJESH KUMAR</title> </head>
<body>
<p>Address - SP collage <br>City - Sirohi <br> Dist Sirohi <br>Pincode -

307001</p>
</body>
</html>
Output :-
Object 4 :- Write html program to heading concept.
Code :-
<html>
<head> <title>Rajesh Kumar</title> </head>
<body>
<h1>This is heding.</h1>
</body>
</html>
Output :-
Object 5 :- Write html program to use BOLD,ITALIC and UNDERLIND attributes.
Code :-
<html>
<body>
<b>This is bold</b><br>
<i>This is italic</i><br>
<u>This is underline</u><br>
</body>
</html>
Output :-
Object 6 :- Write html program to use inline CSS.
Code :-
<html>
<body>
<p style="front-family:serif;front.size:10px;color:red;">Welcome to the my

world...</p>
</body>
</html>
Output :-
Object 7 :- Write html program to h1,h2, P tag in style font-color and font-family
use inline CSS.
Code :-
<html>
<head><title> Rajesh Kumar </title></head>
<body>
<h1 style ="Text-Align: Center ; FONT-FAMILY: Segoe Print"> Welcome to home
Page </h1>
<h2 style =" Text-Align: Center; COLOR: GREEN"> HTML </h2>
<P style ="Text-Align: Center; FONT-FAMILY: Segoe Print"> Hypertext Markup
Language (HTML) is the standard markup language for Rajesh Kumars designed to be
displayed in a web browser.Web browsers receive HTML Rajesh Kumars from a web
server or from local storage and render the Rajesh Kumars into multimedia web
pages.<br><br> HTML describes the structure of a web page semantically and
originally included cues for the appearance of the Rajesh Kumar.HTML can embed
programs written in a scripting language such as JavaScript, which affects the
behavior and content of web pages.</p>
</body>
</html>
Output :-
Object 8 :- Write html program to use ul and li tag.
Code :-
<html>
<head> <title> Rajesh Kumar </title> </head>
<body>
<ul style = "list-style-type:circle; Color:purple; Font-Family:Segoe

Print;FONTSIZE:40px">
<li> Delhi
<li> Mumbai
<li> Kolkata
<li> Chennai
<li> Sirohi
</ul>
</body>
</html>
Output :-
Object 9 :- Write html program to use ol and li tag with list-sytle-type decimal in
css.
Code :-
<html>
<body>
<OL Style="List-Style-Type:Decimal; Font-Family:Segoe Print;Font-Size:30px">
<li>Rajesh
<li>Sahil
<li>Nishant
<li>Chand
<li>Bharat
<li>Pradhuman
</OL>
</body>
</html>
Output :-
Object 10 :- Write html program to use ol and li tag with list-sytle-type Lower-
Alpha in css.
Code :-
<html>
<body>
<OL Style="List-Style-Type:Lower-Alpha; Font-Family:Segoe Print;Font-Size:30px">
<li>Rajesh
<li>Sahil
<li>Nishant
<li>Chand
<li>Bharat
<li>Pradhuman
</OL>
</body>
</html>
Output :-
Greek in css.
Code :-
<html>
<head> <title> Rajesh Kumar</title> </head>
<body>
<OL Style="List-Style-Type:Lower-Greek; Font-Family:Segoe Print;Font-Size:30px">
<li>Rajesh
<li>Sahil
<li>Nishant
<li>Chand
<li>Bharat
<li>Pradhuman
</OL>
</body>
</html>
Output :-
Latin in css.
Code :-
<html>
<body>
<OL Style="List-Style-Type:Lower-Latin; Font-Family:Segoe Print;Font-Size:30px">
<li>Rajesh
<li>Sahil
<li>Nishant
<li>Chand
<li>Bharat
<li>Pradhuman
</OL>
</body> </html>
Output :-
Object 13 :- Write html program to use DL, DT and DD tag with style font-
family,font color and font-size in css.
Code :-
<html>
<body>
<DL>
<DT style="Font-Family:Segoe Print;COLOR:Green;Font-Size:50px"> Moniter
<DD> It is a Output Device
<DT> Mouse
<DD> It is a input Device
</DL>
</body>
</html>
Output :-
Object 14 :- Write html program print two images first image is without border
and second image is with the border and set background image use css.
Code :-
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-image: url('image.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-size: 100%;
</style>
</head>
<body>
<h1 style="text-align: right;color: aliceblue;">Image is without

border:</h1><br>
<img src="Iron-man-full.jpg", width="250px" style="float: right;"><br>
<h1 style="color: aliceblue;text-align:initial;">Img with border:</h1><br>
<img style="border: 6px solid red;"src="download.jpg";input width="300px"; >

<br>
</body>
</html>
Output :-
Object 15 :- Write html program to print a table and use css inline.
Code :-
<html>
<head>
<title> Rajesh Kumar </title>
<body style="background-color:lightgray;">
<table border="5"width="50%">
<Caption style="caption side:bottom;"><b>Perform Information</b></caption>
<TR><TH>NAME</TH><TH>Age</TH></TR>
<TR align="center"><TD>Rajesh</TD><TD>21</TD></TR>
<TR align="center"><TD>Bharat</TD><TD>58</TD></TR>
</table>
</body>
</head>
</html>
Output :-
Object 16 :- Write html program to print table and use internal CSS.
Code :-
<html>
<head>
<title> Rajesh Kumar </title>
<body style="background-color:white;">
<b>Specified color in table</b><br>
<table border="1"style="text-align:center"width="50%">
<tr><th style="background-color:gray;">NAME</th>
<th style="background-color:gray;">Gender</th>
<th style="background-color:gray;">AGE</th>
</tr>
<tr align=center>
<td style="background-color:black;color:white;">Rajesh</td>
<td style="background-color:black;color:white;">Male</td>
<td style="background-color:black;color:white;">20</td>
</tr>
<tr align=center>
<td style="background-color:black;color:white;">Shrupal</td>
<td style="background-color:black;color:white;">Female</td>
<td style="background-color:black;color:white;">18</td>
</tr>
<caption style="caption-side:bottom;"><b>Personal Information</b>
</caption>
</table>
</body>
</head>
</html>
Output :-
Object 17 :- Write html program to print two tables and cell spacing to use
internal CSS.
Code :-
<html>
<head>
<title>Rajesh Kumar</title>
<body style="background-color:white;">
<b>With cell specing</b><br>
<table border="1"style="text-align:center"width="20%">
<tr><th>NAME</th><th>AGE</th></tr>
<tr align="center"><td>Amit</td><td>20</td></tr>
<tr align="center"><td>Rashmi</td><td>18</td></tr>
</table>
<b>With cell specing</b>
<table border="1"style="text-align:center"CELLSPACING="10"width="20%">
<tr><th>NAME</th><th>AGE</th></tr>
<tr align="center"><td>Paramvir</td><td>20</td></tr>
<tr align="center"><td>Radhika</td><td>18</td></tr>
</table>
</body>
</head>
</html>
Output :-
Object 18 :- Write html program to add social media icons with CSS.
Code :-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="rajesh.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-

awesome/4.7.0/css/font-awesome.min.css">

</head>
<body>
<a href="#" class="card">
<i class="fa fa-google"></i>
</a>
<i class="fa fa-instagram"></i>
</a>
<i class="fa fa-facebook-f"></i>
</a>
<i class="fa fa-whatsapp"></i>
</a>
</body>
</html>
CSS :
*{
margin: 0;
padding: 0;
box-sizing: border-box;
body{
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
background: #171717;
.card{
width: 50px; height: 50px;
/* background: rgba(255,255,255,0.144); */
background-color: khaki;
border-radius: 10px;
box-shadow: 0 20px 20px rgba(0, 0, 0, 0.205),
inset 0 20px 20px rgba(253, 253, 253, 0.205);
margin: 15px; display: flex;
justify-content: center; align-items: center;
text-decoration: none;
font-size: 2em;
color: black;
position: relative;
transition: box-shadow .4s, color .8s, transform .4s;
.card:hover{
color: black;
background-color: white;
box-shadow: 0 20px 20px rgba(0, 0, 0, 0.205);
inset: 10 0px 20px rgba(255, 255, 255, 0.287);
inset: 0 20px 10px rgb(255, 58, 58);
inset: -20 0px 20px rgb(104, 255, 58);

inset: -30 0px 20px rgb(71, 58, 255);
transform: translateY(-10px);
Output :-
Object 19 :- Write html program to print table and caption to use inline CSS.
Code :-
<html>
<head>
<body style="background-color:light-gray;">
<table border="5"width="50%">
<Caption style="caption side:bottom;"><b>Train Info</b></caption>

<TR><TH>NAME OF TRAIN</TH><TH>PLACE</TH><TH>DESTINATION</TH></TR>
<TR align="center"><TD>Nagpur Duranto SPL</TD><TD>Bandra
Terminus</TD><TD>Nagpur</TD></TR>
<TR align="center"><TD>MADRAS
MAIL</TD><TD>MADRAS</TD><TD>DELHI</TD></TR>
<TR align="center"><TD>ASHRAM
EXP.</TD><TD>AHMEDABAD</TD><TD>DELHI</TD></TR>
<TR align="center"><TD>DECCAN
EXP.</TD><TD>CHENNAI</TD><TD>MUMBAI</TD></TR>
</table>
</body>
</head>
</html>
Output :-
Object 20 :- Write html program to background-image and a tag.
Code :-
<html>
<head>
<body style="background-image:url(back4.png);"><br>
<h2><i>Welcome to world travel<i><h2><br>
<i><b>Which zone you are integreted!<ul>
<li><a href="East.html">East</a>
<li><a href="North.html">North</a> <li><a
href="West.html">West</a>
<li><a href="South.html">South</a>
</ul></b></i>
</body> </html>
Output :-
Object 21 :- Write html program to use span tag.
Code :-
<html>
<head>
<body style="background-image:url(back4.png);"><br>
<span style="Text-align:center;"<br>
<h2><i>You create missing on valuable information</i></h2>
<br>
<h3><i>Anybody,Have a nice day</i></h3>
</span>
</body>
</head>
</html>
Output :-
Object 22 :- Write html program to use frameset and frame.
Code :-
rajesh1:
<html>
<head>
<style>
body{
background-image: url("rajesh12.jpg");
background-repeat: no-repeat;
background-attachment: fixed;
background-size: 100%;
text-align: center;
font-family: seoge print;
}
</style>
</head>
<body>
<b><br>
<h2>The Devloper Family</h2><p>
</body>
</html>
rajesh2:
<html>
<FRAMESET ROWS="70,*">
<FRAME src="rajesh1.html"Margin height=0 Margin width=0 Name="FRAME1">
<FRAMESET COLS="35%,*">
<FRAME src="rajesh3.html"Name="FRAME2">
<FRAME src="rajesh4.html"Name="FRAME3">
</FRAMESET>
</FRAMESET>
</html>
rajesh3:
<html>
<body style="background-image:url(rajesh21.jpg);text-align:center;background-
repeat: no-repeat;background-attachment: fixed;background-size: 100vh;">
<br><br>
<img height="100"src="download.jpg"/>
<body> </html>
rajesh4:
<html>
<body style="background-image:url(rajesh21.png);background-attachment:
fixed;background-size: 100%;"><br/><br/>
<b><ul>
<li>Rajesh Kumar Devloper</li>
<li>Bharat Solanki Devloper</li>
<li>Sahil Khan Assistent Programmer</li>
<li>Chand Kumar Assistent Programmer</li>
<li>Nishant Assistent Devloper</li>
</ul></b>
</body>
</html>
Output :-

Code:-: Object 1

Uploaded by

Document Information

Original Title

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Code:-: Object 1

Uploaded by

Copyright:

Available Formats

Object 1 :- Write simple html program’s to view the architechture of program.

<head>Welcome to the HTML tutorial</head>

<title> Rajesh Kumar</title>

Object 2 :- Write html program to the write some peragraph.

are tech in all subjects.<br>My Project is E learning.</p>

Object 3 :- Write html program to print address,city,state and pin code.

<head> <title>RAJESH KUMAR</title> </head>

<p>Address - SP collage <br>City - Sirohi <br> Dist Sirohi <br>Pincode -

<head> <title>Rajesh Kumar</title> </head>

Object 6 :- Write html program to use inline CSS.

<p style="front-family:serif;front.size:10px;color:red;">Welcome to the my

<head><title> Rajesh Kumar </title></head>

<h1 style ="Text-Align: Center ; FONT-FAMILY: Segoe Print"> Welcome to home

<h2 style =" Text-Align: Center; COLOR: GREEN"> HTML </h2>

<P style ="Text-Align: Center; FONT-FAMILY: Segoe Print"> Hypertext Markup

programs written in a scripting language such as JavaScript, which affects the

behavior and content of web pages.</p>

Object 8 :- Write html program to use ul and li tag.

<head> <title> Rajesh Kumar </title> </head>

<ul style = "list-style-type:circle; Color:purple; Font-Family:Segoe

<head> <title> Rajesh Kumar </title> </head>

<OL Style="List-Style-Type:Decimal; Font-Family:Segoe Print;Font-Size:30px">

<head> <title> Rajesh Kumar </title> </head>

<OL Style="List-Style-Type:Lower-Alpha; Font-Family:Segoe Print;Font-Size:30px">

<head> <title> Rajesh Kumar</title> </head>

<OL Style="List-Style-Type:Lower-Latin; Font-Family:Segoe Print;Font-Size:30px">

<DT style="Font-Family:Segoe Print;COLOR:Green;Font-Size:50px"> Moniter

<DD> It is a Output Device

<DD> It is a input Device

<h1 style="text-align: right;color: aliceblue;">Image is without

<img src="Iron-man-full.jpg", width="250px" style="float: right;"><br>

<h1 style="color: aliceblue;text-align:initial;">Img with border:</h1><br>

<img style="border: 6px solid red;"src="download.jpg";input width="300px"; >

<title> Rajesh Kumar </title>

<Caption style="caption side:bottom;"><b>Perform Information</b></caption>

<title> Rajesh Kumar </title>

<b>Specified color in table</b><br>

<caption style="caption-side:bottom;"><b>Personal Information</b>

<b>With cell specing</b><br>

<b>With cell specing</b>

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<link rel="stylesheet" href="rajesh.css">

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-

<i class="fa fa-google"></i>

<a href="#" class="card">

<i class="fa fa-instagram"></i>

<a href="#" class="card">

<i class="fa fa-facebook-f"></i>

<a href="#" class="card">

<i class="fa fa-whatsapp"></i>

width: 50px; height: 50px;

box-shadow: 0 20px 20px rgba(0, 0, 0, 0.205),

inset 0 20px 20px rgba(253, 253, 253, 0.205);

margin: 15px; display: flex;

justify-content: center; align-items: center;

transition: box-shadow .4s, color .8s, transform .4s;

box-shadow: 0 20px 20px rgba(0, 0, 0, 0.205);

inset: 10 0px 20px rgba(255, 255, 255, 0.287);

inset: 0 20px 10px rgb(255, 58, 58);

inset: -20 0px 20px rgb(104, 255, 58);

<Caption style="caption side:bottom;"><b>Train Info</b></caption>

<TR align="center"><TD>Nagpur Duranto SPL</TD><TD>Bandra