作业3

最新推荐文章于 2024-06-21 19:20:27 发布

always953

最新推荐文章于 2024-06-21 19:20:27 发布

阅读量232

点赞数

本文链接：https://blog.csdn.net/qq_17565675/article/details/40024403

版权

<!DOCTYPE html>
	<html>
	<head>
	<title>作业</title>
	<meta charset="utf-8">
	<style type="text/css">
	*{
	margin:0px;
	}
	.aa{
	width: 300px;
	height: 40px;
	background-color: #4FC0E8;
	margin-top: 50px;
	margin-left: 500px;
	padding-top: 20px;
	}
	.bb{
	color: white;
	font-size: 16pt;
	font-weight: 900;
	text-align: center;
	}
	.cc{
	background-color: #4FC0E8;
	width: 300px;
	height: 150px;
	margin-top: 20px;
	margin-left: 500px;
	}
	.dd{
	background-image: url(1.gif);
	width: 50px;
	height: 50px;
	margin-top: 20px;
	margin-left: 12px;
	}
	.ee{
	color: white;
	font-size: 16pt;
	font-weight: 900;
	/text-align: 1500px;/
	margin-top: -30px;
	margin-left: 80px;
	}
	.ff{
	color: white;
	font-size: 9pt;
	padding-top: 15px;
	padding-left: 5px;
	font-weight: 600;
	}
	.gg{
	width: 300px;
	height: 40px;
	background-color: #3BAEDA;
	margin-top: 20px;
	margin-left: 500px;
	padding-top: 20px;
	}
	.hh{
	color: white;
	font-size: 16pt;
	font-weight: 900;
	text-align: center;
	margin-top: -25px;
	}
	.ii{
	background-color: #4FC0E8;
	width: 300px;
	height: 250px;
	margin-left: 500px;
	}
	.jj{
	color: white;
	font-size: 120pt;
	font-weight: 900;
	text-align: center;
	/font-family: arial;/
	}
	.kk{
	width: 180px;
	height: 40px;
	background-color: #3BAEDA;
	margin-left: 60px;
	}
	.ll{
	color: white;
	font-size: 16pt;
	font-weight: 900;
	text-align: center;
	padding-top: 10px;
	}
	.mm{
	background-image:url(2.gif);
	width: 30px;
	height: 30px;
	margin-left: 15px;
	}
	.nn{
	background-image: url(3.gif);
	width: 30px;
	height: 30px;
	margin-left: 250px;
	margin-top: -29px;
	}
	</style>

	</head>
	<body>
	<div class="aa" >
	<div class="bb">LOAD MORE</div>
	</div>
	<div class="cc">
	<div class="dd"></div>
	<div class="ee">LOREM IPSUM DOLOR</div>
	<div class="ff">Quisque posuere risus erat at scelerisque felis</br> pulvinar quis. Maecenas arcu lorem , laoreet at </br>
	duiin,hendrent mattis mi.Sed eu vehicula lectus </br>
	felis pulvinar quis.Maecenas arcu lorem,laoreet </br>
	at posuere risus erat.<b>Read More</b>
	</div>
	</div>
	<div class="gg">
	<div class="mm"></div>
	<div class="hh">WEDNESDAY</div>
	<div class="nn"></div>
	</div>
	<div class="ii">
	<div class="jj">26</div>
	<div class="kk">
	<div class="ll">ADD EVENT</div>
	</div>
	</div>
	</body>
	</html>