BCA 1st year Html/css file

Submitted By
RAHUL SAINI
BCA 1st Year
Dezyne E’cole College

Web Layout on HTML / CSS
Submitted By
RAHUL SAINI
BCA – 1st Year
Dezyne E’ Cole College
106/10, Civil Lines, Ajmer
Tel: 0145-2624679
www.dezyneecole.com
2015-2016

Acknowledgement
This Web Layout on “HTML Language” was developed at Dezyne E’cole
College.
During the making of this project I have learnt a lot and I thank my mentor
Mr. Tarun Sharma for helping us during the making of project.
I thank my college “Dezyne E’cole College” for helping us to bring out our
skill.
THANK YOU
RAHUL SAINI
BCA 1st Year

LAYOUT-1
Rahul saini
Bachelor In Computer
Application
I Year
www.dezyneecole.com
LAYOUT -1

Source Code
<html>
<head>
<style>
body{margin:0px;}
#base {height:680px;
width:100%;
background:#444;
position:absolute;
}
#base #head{height:30px;
width:100%;
background:#555;
position:absolute;
}
#base #head #img1 img{height:15px;
width:15px;
margin:8px 0 0 310px;
}
#base #head #t{color:#fff;
font-size:10px;
background:#555;
width:270px;
height:20px;
margin:-12px 0 0 330px;
}
#base #head #img2 img{height:15px;
width:15px;
}
#base #head #t2{color:#fff;
font-size:10px;
background:#555;
width:270px;
height:20px;
}
Rahul saini
Application
I Year
www.dezyneecole.com

#base #head a{text-decoration:none;
color:#fff;
}
#base #head #logo{height:20px;
width:15%;
background:#555;
}
#base #head #logo img{height:30px;
width:80px;
}
#base #header{height:60px;
width:100%;
background:#444;
margin:0px 0px 0px 0px;
}
#base #header #name{color:#fff;
font-size:40px;
}
#base #header #bassse{height:70px;
width:320px;
background:#444;
}
#base #header #bassse #a{height:40px;
width:50px;
background:#444;
display:inline-block;
text-align:center;
margin:10px pxx 0 80px;
}
#base #header #bassse #a a{text-
decoration:none;
color:#fff;
}
#base #header #bassse
#a:hover{background:#green;
border-top:2px solid red;}

#base #mid{height:250px;
width:100%;
background:#f44;
}
#base #mid img{height:20px;
width:20px;
}
#base #mid #v{height:150px;
width:250px;
background:#ff0;
}
#base #mid #v img{height:100%;
width:100%;
margin:0px 0 0 0;
}
#base #mid #w{height:50px;
width:300px;
background:#;
color:#fff;
font-size:20px;
}
#base #mid #w1{height:60px;
width:300px;
background:#;
color:#fff;
}
#base #mid form #e{height:30px;
width:110px;
background:#567;
}
#base #mid form #e
input[type=button]{height:30px;
width:110px
background:#fff;
margin:0px 0 0 0px;}

#base #mid form #f{heigh:30px;
width:110px;
background:#678;
}
#base #mid form #f
input[type=button]{height:30px;
width:110px;
background:#555;
color:#fff;
}
#base #mider{height:250px;
width:100%;
background:#444;
}
#base #mider #t{height:90px;
width:90px;
background:#0f0;
}
#base #mider #t img{height:100%;
width:100%;
}
#base #mider #u{height:90px;
width:90px;
background:#0f0;
}
#base #mider #u img{height:100%;
width:100%;
}
#base #mider #o{height:90px;
width:90px;
background:#0f0;
}

#base #mider #o img{height:100%;
width:100%;
}
#base #mider #p{height:100px;
width:150px;
background:;
position:absolute;
color:#fff;
text-align:center;
}
#base #mider #p1{height:100px;
width:150px;
text-align:center;
color:#fff;
background:;
position:absolute;
}
#base #mider #p2{height:100px;
width:150px;
text-align:center;
color:#fff;
position:absolute;
background: ;
}
#base #footer{height:127px;
width:100%;
text-align:center;
color:#fff;
padding:10px;
background:#555;
box-sizing:border-box;
position:absolute;
}
#base #footer #a {height:50px;
width:160px;
position:absolute;
background:#666;
margin:10px 0 0 245px; }

#base #footer #b {height:50px;
width:160px;
background:#666;
}
#base #footer #c {height:50px;
width:160px;
background:#666;
}
#base #footer #last{ height:20px;
width:70%;
background:#;
color:#fff;
text-align:center;
}
</style>
</head>
<body>
<div id="base">
<div id="head">
<div id="img1"><img
src="fon.png"></img> </div>
<div id="t">phone: ++22 000 400
200</div>
<div id="img2"><img
src="200.png"></img> </div>
<div id="t2"><a href="#">mail:
abc@gmail.com</a></div>
<div id="logo">
<a href="#"><img
src="logo.png"/></a>
</div>
</div>

<div id="header">
<div id="name">invention</div>
<div id="bassse">
<div id="a"><a
href="#">home</a></div>
<div id="a">
<a href="#">pages</a></div>
<div id=“a”><a
href="#">feature</a></div>
<div id="a"><a
href="#">portfolio</a></div>
<div id="a"><a
href="#">blog</a></div>
<div id="a"><a
href="#">contact</a></div>
</div>
</div>
<div id="mid"><img src="set.png "/>
<div id="v"><img src="gogo.png"/></div>
<div id="w">Invention theme for business
agency and creative portfolios</div>
<div id="w1">larem ipsum is simply dummy text of
the printing and typesetting industy.larem ipsum has been the industy
standard dummy text ever since the 1500s
</div>
<form name="r" action="blank" method="post">
<div id="e"><input type="button" value="Read
more"/></div>
<div id="f"><input type="button"
value="Purchase now"/></div>
</form>
</div>
<div id="mider">
<div id="t"><img src="1.png"/></div>
<div id="u"><img src="2.png"/></div>
<div id="o"><img src="3.png"/></div>
<div id="p">Responsive<p>lorem
ipstum is simply dummy text of lorem the typestting & printing .
</p> </div>

<div id="p1">Customizable<p>lorem
ipstum is simply dummy text of lorem the typestting & printing
</P> </div>
<div id="p2">Retina ready<p>lorem
ipstum is simply dummy text of lorem the typestting & printing
</p> </div>
</div>
<div id="footer">Recent work
<div id="a"></div>
<div id="b"></div>
<div id="c"></div>
<div id="last">Designed by rahul saini
© dezyne ecole college 2016</div>
</div>
</div>
</body>
</html>

LAYOUT-2
Rahul saini
Application
I Year
www.dezyneecole.com
LAYOUT-2

Source Code
Rahul saini
Application
I Year
www.dezyneecole.com
<html>
<head>
<style>
body{margin:0px;}
#base {height:677;
width:100%;
background:#eed;
position:absolute;
}
#base #head{height:80px;
width:100%;
background:#f00;
color:#fff;
padding:26px 0 0 160px;
font-size:45px;
position:absolute;
}
#base #head #a{height:40px;
width:80px;
background:;
margin:0px 0px 0px
10px;
display:inline-block;
padding:-20px 0 0 0px;
text-align:center;
font-size:20px;
}
#base #head #a a{color:#fff;
text-
decoration:none;
}
#base #head
#a:hover{background:#129;
}

#base #mid{height:500px;
width:100%;
background:url(sunset.jpg);
background-attachment:fixed;
background-size:100%;
position:absolute;
}
#base #mid #c{height:300px;
width:620px;
background:;
position:absolute;
}
#base #mid #t{height:40px;
width:350px;
background: ;
color:#fff;
padding:px 0 0 0;
font-size:30px;
text-align:center;
}
#base #mid #t2{height:40px;
width:600px;
background:;
color:#fff;
padding:px 0 0 0;
font-size:20px;
text-align:center;
}
#base #mid #t3{height:30px;
width:350px;
background:;
color:#fff;
padding:px 0 0 0;

font-size:20px;
text-align:center;
}
#base #mid #c form
input[type=text]{height:25px;
width:220px;
border:none;
}
#base #mid #c form
input[type=password]{height:25px;
width:220px;
border:none;
margin:15px 0 0
70px;
}
#base #mid #c form
input[type=submit]{height:25px;
width:220px;
border:none;
background:#00f;
color:#fff;
margin:20px 0 0
70px;
}
#base #mid #c form #v{height:130px;
width:1px;
margin:-115px 0 0
325px;
background:#fff;
}
#base #mid #c form
#a[type=submit]{height:50px;
width:200px;
background:#19f;
border:none;
margin:-120px 0 0
360px; }

#base #mid #c form
#b[type=submit]{height:50px;
width:200px;
border:none;
background:orange;
margin:-60px 0 0
360px;
}
#base #footer{height:60px;
width:100%;
background:#444;
position:absolute;
color:#fff;
padding:15px 0 0 100px;
}
#base #footer a{color:#fff;
text-decoration:none;
}
</style>
</head>
<body>
<div id="base">
<div id="head">ROBLOX
<div id="a"><a
href="#">home</a></div>
<div id="a"><a
href="#">games</a></div>
<div id="a"><a
href="#">catalogue</a></div>
<div id="a"><a
href="#">build</a></div>
<div id="a"><a
href="#">upgrade</a></div>
<div id="a"><a
href="#">forum</a></div>

<div id="a"><a href="#">more</a></div>
</div>
<div id="mid">
<div id="c">
<div id="t">welcome to ROBLOX</div>
<div id="t2">the free online buliding
game where users asimo 3089 built
THE WIND
</div>
<div id="t3">TAKE A TOUR</div>
<form name="signup" action="blank"
method="post">
<input type="text" name="o"
placeholder="username"/><br>
<input type="password" name="p"
placeholder="password"/><br>
<input type="submit" name="i"
value="login with facebook"/>
<div id="v"></div>
<input type="submit" id="a"
name="o1" value="sign up"/><br>
<input type="submit" id="b"
name="p1" value="play now"/>
</form>
</div>
</div>
<div id="footer">
<a href="#">privacy policy</a> 
<a href="#">|advertise with us</a> 
<a href="#">|press |</a>
<a href="#">contact us |</a>
<a href="#">about us  |</a>
<a href="#">blog |</a>
<a href="#">jobs |</a>
<a href="#">parents</a>
</div>
</div>
</body>
</html>

BCA 1st year Html/css file

Recommended

Recommended

More Related Content

Similar to BCA 1st year Html/css file

Similar to BCA 1st year Html/css file (20)

More from Rahul Saini

More from Rahul Saini (9)

Recently uploaded

Recently uploaded (20)

BCA 1st year Html/css file