0

我不明白是否应该在它修改的标签之前或之后指定类。

我的样式表中的以下内容适当地修改了 div：

div.idea {
  margin: 0.1cm;
  }

以下没有：

.idea div {
      margin: 0.1cm;
}

但是，以下内容不会修改我的锚点：

a.idea {
      color: Orange;
}

以下是：

.idea a {
      color: Orange;
}

解释？

4

5 回答 5

5

div.idea意味着div一个类idea

.idea div表示div在具有类的元素内idea

他们针对不同的元素。如果没有看到您的 HTML，就无法解释为什么您会看到您认为不寻常的行为。

于 2012-08-02T09:40:34.363 回答
3

一个空间非常重要。一个空格的意思是“孩子”的。没有空格意味着“和”。

所以：

div.idea: 一个带有类的 dividea

<DIV class="idea"></DIV>

div .idea：具有“idea”类的子级，其父级是 div（在其上方的任何位置）

<DIV>
  <DIV class="idea"></DIV>
</DIV>
于 2012-08-02T09:39:07.030 回答
2

CSS 选择器：

div.idea { ...  // a div that has a class="idea"
.idea div { ... // any div, that has a parent (or ancestor) that has a class="idea"
a.idea { ...    // an <a> element which has a class="idea" ( <a class="idea">text</a> )
.idea a { ..    // an <a> element which has a parent (or ancestor) of any element type (not only div) which has a class="idea"

参考CSS 选择器，尤其是类选择器

于 2012-08-02T09:38:57.110 回答
2

在使用类选择器之前你不需要指定任何元素——它只是增加了一层特殊性。

你的第一个例子：

div.idea {
  margin: 0.1cm;
}

这首先选择所有 div 元素，然后将它们限制为具有 class 的元素idea。

你的第二个例子：

.idea div {
      margin: 0.1cm;
}

选择所有具有 class 的元素idea，然后选择这些元素的所有子元素。

这两个表达式等同于不同的事物：

div.idea选择具有类想法的 div
.idea div选择作为 div 的元素的子idea元素

实际上，空间使您选择孩子

于 2012-08-02T09:39:12.703 回答
1

你的 CSS 选择器假设如下

div.idea {边距：0.1cm;}

<div class="idea" id="iGetStyled">...

.idea div {边距：0.1cm;}

<div class="idea"><div id="iGetStyled">...

a.idea {颜色：橙色；}

<a class="idea" id="iGetStyled">...

.idea {颜色：橙色;}

<div class="idea"><a id="iGetStyled">...

id="iGetStyled"向您显示哪些项目将被样式化

于 2012-08-02T09:39:25.047 回答