验证“div”。只是“。”

问题描述：

<body class="sign-in-body"> 
<div class="container sign-in-container"> 
    <div class="row"> 
     <div class="col"> </div> 
     <div class="col-8"> 
      <div class="card"> 
       <div class="card-block"> 
       This is some text within a card block. 
       </div> 
      </div> 
     </div> 
     <div class="col"> </div> 
    </div> 
</div>

我想一个margin-top: 15%添加到我的容器类。要做到这一点，我写，

div.container.sign-in-container { 
    margin-top: 15%; 
}

但问题是，如果我补充一点，

.container.sign-in-container

它的工作原理。这是为什么？

答

选择器.container.sign-in-container将选择具有container和sign-in-container类的任何元素。

但div.container.sign-in-container将只选择元素与css类。

既然你只有两个班div，无论是选择的工作。

您应该阅读大约css选择器。 This是一个很好的参考开始。

答

在css中，您只需添加一个css类即可，不需要添加div.container.sign-in-container。这也适用于一类.sign-in-container。如果你想覆盖CSS，那么你可以使用div的父亲。

答

您使用的是类级别的CSS选择器。它会工作。您可以在CSS中使用多种selectors和combinators来定位页面上的元素。

你的榜样

div.container.sign-in-container 
div.sign-in-container 
div.container 
.container.sign-in-container 
.container 
.sign-in-container

所有要针对同一div，这就是为什么它的工作原理。

验证“div”。只是“。”

相关推荐