这次课堂练习感觉还勉强把
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
.a{
margin-top:100px;
width: 1366px;
height: 598px;
background: #AAC622;
}
.a1{
width: 1366px;
height: 131px;
border: 1px #A8A597;
background-image: url(a.png);
}
.a2{
width: 1366px;
height: 467px;
background-image: url(a.jpg)
}
.c{
padding-top: 24px;
padding-left: 203px;
width: 960px;
height: 380px;
}
.c1{width: 320px;
height: 380px;
float: left;
}
.c1-1{
width: 320px;
height: 93px;
border-left: groove 1px white;
}
.zt{
padding-left: 20px;
padding-top: 20px;
font-size: 20px;
font-weight: 700;
font-family: arial;
color: white;
}
.z{
margin-top: -45px;
margin-left: 120px;
color: #56564A;
font-size: 20px;
padding-top: 20px;
}
.zt1{
padding-left: 20px;
font-size:25px;
line-height: 20px;
color: white;
float: left;
}
.zt2{
font-size: 20px;
color: #56564A;
line-height: 20px;
}
.c1-2{
margin-top: 9px;
width: 320px;
height: 278px;
}
.xzt{
padding-left: 23px;
padding-top: 20px;
font-size: 12px;
font-family: arial;
font-weight: 600;
color: #706E64;
letter-spacing: 0.05em;
}
.b{
width: 207px;
height: 131px;
float: left;
}
.b1{
width: 520px;
height: 131px;
float: left;
}
.b2{
width: 567px;
height: 131px;
float: left;
}
.tp{
padding-top: 30px;
width: 65px;
height: 6px;
float: left;
}
.tp2{
width: 582px;
height: 162px;
}
h1{
color: #E1D0BE;
font-family: aa;
font-size: 60px;
margin-top: 20px;
}
h6{
padding-left: 76px;
margin-top: -50px;
color: #C0B4A4;
}
@font-face{
font-family: aa;
src:url(Sansation_Light.ttf);
}
</style>
</head>
<body>
<div class="a">
<div class="a1">
<div class="b">
<img src="0.png">
</div>
<div class="b1">
<div class="tp">
<img src="5.png">
</div>
<h1>veexte's tteg</h1>
<h6>
creativity catalyst an design inspiration
</h6>
</div>
<div class="b2">
<div class="tp2">
<img src="me.png">
</div>
</div>
</div>
<div class="a2">
<div class="c">
<div class="c1">
<div class="c1-1">
<div class="zt">GRAPHIC</div>
<div class="z">&</div>
<div class="zt1">WEB</div>
<div class="zt2"> design</div>
</div>
<div class="c1-2" style="">
<img src="1.jpg">
<div class="xzt">
Design is my work,my play,my worldview.<br>
I'm driven to share all that grabs my heart<br>
about grapahic design,artists,typography,<br>
CSS/(X)HTML,and the web in these posts,<br>
tutorials,and interviews.</div>
</div>
</div>
<div class="c1">
<div class="c1-1">
<div class="zt">MODERN</div>
<div class="zt1">HOME</div>
<div class="zt2"> design</div>
</div>
<div class="c1-2" style="">
<img src="2.jpg">
<div class="xzt">
Design is my work,my play,my worldview.<br>
I'm driven to share all that grabs my heart<br>
about grapahic design,artists,typography,<br>
CSS/(X)HTML,and the web in these posts,<br>
tutorials,and interviews.</div>
</div>
</div>
<div class="c1"><div class="c1-1">
<div class="c1-1" >
<div class="zt" style="color:#E1FEF0;">BELGLAN</div>
<div class="zt1" style="color:#E1FEF0;">GRAPHIC</div>
<div class="zt2"> design</div>
</div>
<div class="c1-2" style="">
<img src="3.jpg">
<div class="xzt">
Belgina aren't just cheerfully churning out<br>
chocolate an beer!For centuries,we've<br>
created influential and striking graphic<br>
design,typography,and illustration.<br>
Delight ina gallery of Belgin work.
</div>
</div>
</div></div>
</div>
</div>
</div>
</body>
</html>
浙公网安备 33010602011771号