麻烦老师检查

来源:3-12 编程练习

localhost999

2020-06-25 16:52:48

<!DOCTYPE html>
<html>
    <head>
   <meta charset="UTF-8">
   <title>vertical-align</title>
   <style type="text/css">
    *{padding:0px;margin: 0px;}
   
    .warp1{    
              height:80px;
              width: 100%;
              background-color: #14191e;              
           /*在此补充代码*/
             }

     .warp1 h1{ color:#fff;
       line-height:80px;
         text-align:center;
     }

     .warp2{
              height:400px;
              width: 100%;
              border:1px  #14191e solid;
              display:table
              /*在此补充代码*/                    
             }

     .content{    
              display:table-cell;
              vertical-align:middle;
              }

     .content  p{ width:500px;
                  font-family: "微软雅黑";
                  margin:0 auto;
                  
        /*在此补充代码*/}   

   </style>
</head>
<body>
<div class="warp1">
          <h1>欢迎来到慕课网</h1>      
</div>
  <div class="warp2">
        <div class="content">
           <p>慕课网,只学有用的!</p>
           <p>慕课网(IMOOC)是IT技能学习平台。慕课网(IMOOC)提供了丰富的移动端开发、php开发、web前端、android开发以及html5等视频教程资源公开课。并且富有交互性及趣味性,你还可以和朋友一起编程。</p>
        </div>
</div>    

</body>
</html>


写回答

1回答

好帮手慕言

2020-06-25

同学你好,有几个问题需要注意,可以参考下方:

1、按照要求,H1字体大小为24px,代码参考:

http://img.mukewang.com/climg/5ef4736b090c78d903740091.jpg

2、段落内容行高1.5em,字体大小14px

http://img.mukewang.com/climg/5ef473d70975907e03980114.jpg

3、页面出现了横向滚动条,如下:

http://img.mukewang.com/climg/5ef473ea0965099407490149.jpg

原因是宽度设置为100%以后,又设置左右边框,导致超出了父容器,出现滚动条。可以只设置底边框:

http://img.mukewang.com/climg/5ef4743d0991094305870187.jpg

如果我的回答帮到了你,欢迎采纳,祝学习愉快~

0

0 学习 · 40143 问题

查看课程