2-5作业提交

首页课程实战体系课手记专栏慕课教程

2-5作业提交

来源：2-5 编程练习

qq_慕斯7214945

2020-08-15 16:29:43

<!DOCTYPE html>

<html>

<head>

<title>IMOOC</title>

<style>

*{margin: 0;padding:0; font-family: Arial, Helvetica, sans-serif;}

section{

width: 1200px;

margin: 34px auto 0;

}

section h1{

font-size: 30px;

font-weight: lighter;

margin-bottom: 23px;

}

section h1 > span{

color: #7c7c7c;

}

section > aside{

float: left;

width: 450px;

}

section > article{

float: right;

width: 720px;

}

section > aside > dl{

position: relative;

margin-bottom: 15px;

height: 80px;

}

section > aside > dl > dt{

background-image: url(http://climg.mukewang.com/582e61290001787900500051.png);

background-repeat: no-repeat;

height: 50px;

width: 50px;

text-align: center;

line-height: 50px;

color: #fff;

font-size: 28px;

position: absolute;

left: 0;

}

section > aside > dl > dd:first-of-type{

position: absolute;

left: 60px;

top: -1px;

text-decoration: underline;

font-weight: bold;

font-size: 16px;

line-height: 16px;

}

section > aside > dl > dd:last-of-type{

position: absolute;

left: 60px;

top: 20px;

font-size: 14px;

font-weight: lighter;

}

section > article > p,

section > article > img{

margin-bottom: 20px;

}

section > article > img{

width: 100%;

height: 200px;

}

</style>

</head>

<body>

<aside>

<h1>Recent <span>Course</span></h1>

<dl>

<dd>Hyper Text Markup Language</dd>

<dd>HTML is the standard markup language used to create web pages and its elements form the building blocks of all websites.</dd>

</dl>

<dl>

<dd>Cascading Style Sheets</dd>

<dd>Cascading Style Sheets (CSS) is a simple mechanism for adding style (e.g., fonts, colors, spacing) to Web documents.</dd>

</dl>

<dl>

<dd>JavaScript</dd>

<dd>JavaScript is a high-level, dynamic, untyped, and interpreted programming language.</dd>

</dl>

<dl>

<dd>AngularJS</dd>

<dd>AngularJS is an open-source web application framework mainly maintained by Google and by a community of individuals and...</dd>

</dl>

</aside>

<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>

<p>We hope that all the students 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>

写回答

1回答