css解释为选择适用元素

Question

有人可以请解释选择器是什么意思？ 据我了解有#myId - 是控制id = myId的css。 .myClass是用于类myClass的控件的Css。 有人可以请解释其他组合？

div.img a:hover img 
    { 
    border:1px solid #0000ff; 
    } 
div.desc 
    { 
    text-align:center; 
    font-weight:normal; 
    width:120px; 
    margin:2px; 
    } 

Answer 1

id（＃）在文档中只能存在一次。在CSS和JavaScript中识别元素也是非常有用的（你是否需要它）。'

类（。）可以根据需要经常使用。

例如：你只有一个标题：<div id="header">Header</div>，但几篇文章：<div class="article">...</div>

---

说你有这样的HTML文档：

<div id="site"> 
    <h1>Some heading...</h1> 
    <div class="article"> 
     <h1>Title</h1> 
     <p>Some content...</p> 
    </div> 
    <div class="article"> 
     <h1>Title</h1> 
     <p>Some content...</p> 
    </div> 
</div> 

文章的标题应该不会像作为网站的标题很大，所以我们必须使用更具体的选择器：.article h1 {...}。这将在类“文章”的元素中设置每个<h1>元素的样式。

如果我们想要一个更具体的选择器，我们将使用：div.article h1 {...}。这只会对<div>框中的每个<h1>元素设置样式，其文档类为

Answer 2

div.img a:hover img

选择那些内的图像徘徊链接，是内部与img类div元素，让他们有一个蓝色边框。

div.desc

与类desc选择div秒。

Answer 3

div.img a:hover img意思是：我找一个img元素这是一个a元素当前正在上空盘旋，这又与类名OG img一个div元素的后代的后代。

div.desc只需选择任何div的类名称desc。

Answer 4

看看标准定义，我总觉得这个有用：CSS selectors at W3C。

Answer 5

div.img a:hover img 

这将匹配任何img标签，其为a标签这是目前在一个hover状态是具有class="img"一个div标签内内。

div.desc 

这将任何div标签匹配class="desc"。

当项目像这样链接在一起时，它们之间只有空格，它与特定层次的元素相匹配。例如，在第一个标签中，不在a标签中的img标签将不会匹配。

您还可以使用逗号分隔项目，而不是匹配物品层次结构将分别匹配每个项目。所以像div.img, img这样的东西将匹配任何div标签与class="img"，并将匹配任何img标签。

专门针对:hover属性，这就是所谓的pseudo-class。它通过查找处于特定状态（在这种情况下，正在盘旋）的那种类型的项来修改它所附属的属性（在本例中为a）。