CSS class前后元素

Question

我有个简单的问题

这两个语句有什么区别？

例：

.job-des li{ 
//you styles here 
} 

AND

li.job-des{ 
//you styles here 
} 

Answer 1

.job-des li{ 
//you styles here 
} 

在该组块的代码

li可以在任何地方在于一个elemenet，它的类job-des 像

<div class="job-des"> 
    <ul> 
     <li>This is selected as per the conditions </li> 
     <li>This is selected as per the conditions </li> 
     <li>and this one too </li> 
    </ul> 
</div> 

在此代码

它会选择所有li's这是在特定的类

在这

li.job-des{ 
//you styles here 
} 

只有

那些li's将被程式化，其班级给出.job-des

<div class="any class"> 
     <ul> 
      <li> i am not selected</li> 
      <li class="job-des">i am selected as per the conditions </li> 
      <li> and this one too is not selected </li> 
     </ul> 
    </div> 

Answer 2

首先是包含在具有类.job-des任何元件<li>元件，而第二个是任何<li>元素本身具有类.JOB -des

例如，第一个会碰到这个：

<div class='job-des'> 
    <ul> 
     <li>It hits me</li> 
    </ul> 
</div> 

而第二个会打这样的：

<ul> 
    <li class='job-des'>It hits me</li> 
</ul> 

Answer 3

说明

首先 .job-des li{这将适用于LI这是.job-des类的孩子。

例

<div class="job-des"><li></li></div> 

二li.job-des {这将适用于LI有工作-DES类。

例

<li class="job-des"></li> 

Answer 4

.job-des li{ 
//This style will apply in li of the element have class .jobs-des 
} 

AND

li.job-des{ 
//This style will apply on li which have class .job-des 
}