页面布局

最新推荐文章于 2025-07-14 17:00:18 发布

原创最新推荐文章于 2025-07-14 17:00:18 发布 · 425 阅读

CC 4.0 BY-SA版权

<!DOCTYPE html>
<html>
<meta charset="utf-8">
<head>
<title></title>
<style type="text/css">
div{
background-color: white;
width: 350px;
/*height: 750px;*/
margin-left: 200px;

}
.a{
background-color: #4FC0E8;
font-size: 30px;
color: white;
padding-top:20px;
padding-bottom: 20px;
text-align: center;
}
.b{
color: white;
font-size: 20px;
background-color: #4FC0E8;
margin-top: 20px;
width: 340px;
height: 70px;
padding-left: 10px;
}
.c{
color: white;
font-size: 15px;
background-color: #4FC0E8;
padding-bottom: 20px;

}
.d{
color: white;
font-size: 20px;
background-color: #3BAEDA;
margin-top: 15px;
padding-top:20px;
padding-bottom: 20px;
text-align: center;
}
.e{
color: white;
font-size: 120px;
background-color: #4FC0E8;
text-align: center;
height: 240px;

}
.f{
color: white;
font-size: 20px;
background-color: #3BAEDA;
width: 150px;
margin-left: 100px;

}
</style>
</head>
<body>
<div>
<div class="a" >

LOAD MORE

</div>
<div class="b">
<img src="1.jpg">
LOREM IPSUM DOLOR
</div>
<div class="c">
Quisque posuere risus erat at seclerque felis
ahsdgsah sj dh jsa.sa dahdag shfsjh.ada hd s
adasd.ajsa fhsa jfs ah jf sed ey jasdhdsfkdskj
sdfsd sad asdsa sadas sadsa sf fdg gd asdsa
asdhjadfsfjds.Read More
</div>
<div class="d">
<img src="2.jpg">        
WEDNESDAY        
<img src="3.jpg">
</div>
<div class="e">
26
<div class="f">
ADD EVENT
</div>
</div>

</div>

</body>
</html>