​请老师检查是否正确

来源:2-10 编程练习

萌神丶kin

2019-09-15 22:01:31

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title></title>
  <style type="text/css">
    *{
      margin:0;
      padding:0;
      text-decoration: none;
      list-style: none;
    }
    div.Navigation{
      width: 100%;
      background: black;
      overflow: hidden;
      zoom:1;
    }
    /*div.Navigation子级*/
    div.Navigation img{
      float: left;
    }
    div.Navigation ul{
      float: right;
      height: 100px;
      line-height: 100px;
    }
    /*ul子级*/
    div.Navigation ul li{
      color: white;
      float: left;
      padding: 0 50px;
    }
    /*底部区域*/
    div.data-role{
      width: 100%;
      background: black;
    }
    div.data-role ul{
      height: 100px;
      line-height: 100px;
      width: 984px;
      margin:0 auto;
      overflow: hidden;
      zoom:1;
    }
    div.data-role ul li{
      color: white;
      float: left;
      padding: 0 50px;
    }
    /*内容区域*/
    div.Content{
      width: 100%;
      background: red;
    }
    div.Content div.Theme{
      width: 50%;
      height: 744px;
      margin:0 auto;
      box-sizing: border-box;
      padding-top: 100px;
    }
    div.Content div.Theme .left{
      width: 50%;
      float: left;
      height: 100%;
    }
    div.Content div.Theme .right{
      width: 50%;
      float: right;
      height: 100%;
    }
    /*内容区域字体样式*/
    div.Content div.Theme .left dl dt,div.Content div.Theme .right dl dt{
      font-size: 25px;
      font-weight: bold;
    }
    dd{
      margin: 10px 0 20px 0;
    }
    span{
      background: orange;
    }
  </style>
</head>
<body>
  <!-- 头部区域(导航栏) -->
  <div class="Navigation">
    <img src="http://climg.mukewang.com/58c0d2d900016ce303000100.png" alt="logo">
    <ul>
      <li>课程</li>
      <li>职业路径</li>
      <li>实战</li>
      <li>猿问</li>
      <li>手记</li>
    </ul>
  </div>
  <!-- 内容区域 -->
  <div class="Content">
    <div class="Theme">
     <div class="left">
       <dl>
         <dt>课程推荐</dt>
         <dd><span>职业路径</span>&nbsp;&nbsp;HTML与css3实现动态网页</dd>
         <dd><span>职业路径</span>&nbsp;&nbsp;零基础入门Android语法与界面</dd>
         <dd><span>职业路径</span>&nbsp;&nbsp;ios基础语法与常用控件</dd>
         <dd><span>职业路径</span>&nbsp;&nbsp;PHP入门开发</dd>
         <dd><span>职业路径</span>&nbsp;&nbsp;JAVA入门开发</dd>
       </dl>
     </div>
     <div class="right">
       <dl>
         <dt>相关课程</dt>
         <dd>HTML&nbsp;&nbsp;CSS&nbsp;&nbsp;JavaScript</dd>
         <dd>HTML5&nbsp;&nbsp;CSS3&nbsp;&nbsp;Jquery</dd>
         <dd>移动端基础&nbsp;&nbsp;移动端APP开发</dd>
       </dl>
     </div>
    </div>
  </div>
  <!-- 底部区域 -->
  <div class="data-role">
       <ul>
         <li>网站首页</li>
         <li>企业合作</li>
         <li>人才招聘</li>
         <li>联系我们</li>
         <li>常见问题</li>
         <li>友情链接</li>
       </ul>
  </div>
</body>
</html>

请老师检查是否正确,a标签没加。。这个应该无所谓吧。
有问题请老师指教

写回答

1回答

好帮手慕星星

2019-09-16

同学你好,

代码整体布局是不错的,很棒!

在这里a标签加不加都是可以的,没有指定要加上哦。

祝学习愉快!

0

0 学习 · 40143 问题

查看课程