麻烦老师检查下

来源：2-5 编程练习

学习plus

2020-04-05 21:38:59

<!DOCTYPE html>
<html>
<head>
	<title></title>
	<meta charset="utf-8">
	<link rel="stylesheet" type="text/css" href="html5布局练习2-5.css">
</head>
<body>
<section class="main">
	<aside>
		<h1>Recent <span>Course</span></h1>
		<dl>
			<dt>Hyper TextMarkup Language</dt>
			<dd>HTML is the standard markup language used to create web pages and its elements form the building blocks of all websites.</dd>
			<dd><img src="http://climg.mukewang.com/582e61290001787900500051.png"></dd>
			<p>1</p>
		</dl>
		<dl>
			<dt>Cascading Style Sheets</dt>
			<dd>Cascading Style Sheets(CSS) is a simple mechanism for adding style(e.g,fonts,colors,spacing) to Web docurments</dd>
			<dd><img src="http://climg.mukewang.com/582e61290001787900500051.png"></dd>
			<p>2</p>
		</dl>
		<dl>
			<dt>JavaScript</dt>
			<dd>JavaScript is a high-level,dynamic,untyped,and interpreted programming language.</dd>
			<dd><img src="http://climg.mukewang.com/582e61290001787900500051.png"></dd>
			<p>3</p>
		</dl>
		<dl>
			<dt>AngularJS</dt>
			<dd>AngularJS is an open-source web application frameword mainly maintained by Goodgle and by a community of individuals and...</dd>
			<dd><img src="http://climg.mukewang.com/582e61290001787900500051.png"></dd>
			<p>4</p>
		</dl>
	</aside>
	<article>
		<h1>Welcome to <span>Massive Open Online Course!</span></h1>
		<p>We provide the latest knowledge to help you cope with the changing world!</p>
		<img src="http://climg.mukewang.com/582e61180001ede703300130.jpg">
		<p>We hopt that all the sudents who love the internet can be more convenient access to learning resources,using the internet thinking to change our learning.</p>
		<p>Focus on IT skills education MOOC,consistent with the development trend of the internet down to earth's MOOC.We are free,we only teach useful,we concentrate on education.</p>
	</article>
</section>

</body>
</html>

CSS代码：

*{
	margin: 0;
	padding: 0;
	border: none;
	font-size: 14px;
	font-family: "微软雅黑";
}
.main{
	width: 1200px;
	height: 460px;
	overflow: hidden;
	margin: 0 auto;
}
.main h1{
	font-size: 30px;
	font-weight: lighter;
	margin: 23px 0;
}
.main h1 span{
	font-size: 30px;
	color: #7c7c7c;
}
.main > aside{
	width: 500px;
	float: left;
}
.main > aside > dl{
	position: relative;
	height: 85px;
}
.main > aside dl dt{
	font-size: 18px;
	line-height: 18px;
	font-weight: lighter;
	text-decoration: underline;
	position: absolute;
	top: -1px;
	left: 100px;
}
.main > aside > dl > dd:first-of-type{
	position: absolute;
	top: 20px;
	left: 100px;
}
.main > aside > dl > dd:last-of-type{
	margin: 0 25px;
}
.main > aside > dl >p{
	font-size: 22px;
	position: absolute;
	top: 10px;
	left: 43px;
	color: #fff;
}
.main > article{
	width: 650px;
	float: right;
}
.main > article > p{
	margin: 10px 0;
}
.main > article > img{
	height: 200px;
	width: 100%;
}

麻烦老师检查下是否有不规范的地方

写回答

1回答