老师请检查

来源：2-5 编程练习

keepangry2297447

2020-03-24 17:12:05

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>IMOOC</title>
<style>
  .main{
   position:relative;
   width: 1200px;
   height: 473px;
   margin: 0 auto;
   font-family: arial;
  }
  aside{
   width: 450px;
   float: left;
  }
  aside > h1,
  article> h1{
   margin-bottom:25px;
   font-size: 30px;
   font-weight: lighter;
  }
  aside > h1 > samp,
  article> h1 >samp{
   color: #7c7c7c;
   font-size: 30px;
  }
  aside > dl{
   height: 90px;
   position: relative;
   margin-bottom: 20px;
   display: block;
   font-size: 16px;  }
  aside > dl > dt{
   position: absolute;
   left: 110px;
   font-weight: bold;
   text-decoration: underline;
  }
  aside > dl> dd >p{
   font-size: 20px;
   position: absolute;
   left: 19px;
   margin-top: 15px;
   color: #fff;
  }  aside > dl> dd:first-of-type{
   position:absolute;
   left: 0;
   list-style: none;
  }
  aside > dl> dd:last-of-type{
   position:absolute;
   left: 70px;
   top:30px;
  }
  article{
   float: right;
   width: 720px;
  }
  article > p{
   font-size: 16px;
   line-height: 20px;
   margin-bottom: 20px;
   overflow: hidden;
  }
  article > img{
   height: 251px;
   width: 720px;
  }

</style>
</head>
<body>
<section class="main">
  <aside>
   <h1>Recent <samp>Course</samp></h1>
    <dl>
     <dt>Hyper Text Markup Language</dt>
     <dd><p>1</p><img src="http://climg.mukewang.com/582e61290001787900500051.png" alt=""></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>
     <dt>Cascading Style Sheets</dt>
     <dd><p>2</p><img src="http://climg.mukewang.com/582e61290001787900500051.png"></dd>
     <dd>Cascading Style Sheets (CSS) is a simple mechanism for adding style (e.g., fonts, colors, spacing) to Web documents.</dd>
    </dl>
    <dl>
     <dt>JavaScripte</dt>
     <dd><p>3</p><img src="http://climg.mukewang.com/582e61290001787900500051.png"></dd>
     <dd>JavaScript is a high-level, dynamic, untyped, and interpreted programming language.</dd>
    </dl><dl>
     <dt>AngularJS</dt>
     <dd><p>4</p><img src="http://climg.mukewang.com/582e61290001787900500051.png" alt=""></dd>
     <dd>AngularJS is an open-source web application framework mainly maintained by Google and by a community of individuals and...</dd>
    </dl>
  </aside>
  <article>
   <h1>Welcome to <samp>Massive Open Online Course</samp></h1>
   <p>We provide the latest knowledge to help you cope with the charging world!</p>
   <img src="http://climg.mukewang.com/582e61180001ede703300130.jpg">
   <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 devlopment trend of the internet down to the earth's MOOC. We are free,we only teach useful,we concentrate on education.</p>
  </article>
</section>
</body>
</html>