请大家帮我看看有什么需要改动的

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title></title>
  <style type="text/css">
    /*此处写代码*/
    *{margin:0;
        padding:0;
    }
    .bg{background:black;
        width:1100px;
        height:100px;
        position:absolute;
        top:50%;
        left:50%;
        margin-left:-550px;
        margin-top:-50px;
    }
    .logo{
        background:url(http://img1.sycdn.imooc.com/climg//58c0d2d900016ce303000100.png);
        width:300px;
        height:80px;
        float:left;
    }
    .dht{
      width:100px;
      height: auto;
      color: white;
      float: right;
      font-size: 20px;
      line-height: 100px;
      margin-left:30px;
      text-align: center; 
      cursor: pointer;         
    }
    .dht:nth-child(4){margin-left: 40px;}

  </style>  
</head>
<body>
  <!-- 此处写代码 -->
  <div class="bg">
      <div class="logo"></div>
      <div class="dht">手记</div>
      <div class="dht">猿问</div>
      <div class="dht">实战</div>
      <div class="dht">职业路径</div>
      <div class="dht">课程</div>
  </div>
  
</body>
</html>

AiChiRol 2018-03-05

源自：CSS网页布局基础 2-4 编程练习

收起

3回答

小丸子爱吃菜回答被采纳获得+3积分 2018-03-06 09:57:54

:nth-child(n) 选择器匹配属于其父元素的第 N 个子元素，不论元素的类型。

你的代码中，匹配的是其父元素<div class="bg">的第4个子元素。

该选择器是CSS3中的选择器，当前学习阶段，使用我们的类或者id选择器去写就可以实现了，进阶的专题中会有详细讲解CSS3的选择器，先学好当前的内容吧。

祝学习愉快！

收起回答

AiChiRol 提问者 #1

谢谢，因为看到视频里有用到就想自己试一试

2018-03-06 10:00:20
AiChiRol 提问者 #2

还想问一下，除了我这样设置，还有什么方法能够让字体间距一样呢？谢谢

2018-03-06 10:15:31

小丸子爱吃菜 2018-03-06 11:16:16

这个间距就是使用padding或者margin去实现的。

收起回答

提问者 AiChiRol 2018-03-05 21:04:38

问一个问题：为什么我在设置.dht:nth-child(4){margin-left: 40px;}时候，我想设置的是“实战”的margin-left的值，我当时用的是.dht:nth-child(3){margin-left: 40px;}，因为在class="dht"的元素中“实战”在我代码看起来是第三个，为什么要设置4而不是3呢

收起回答