CSS - 这个选择器的含义是什么

Question

adfafdadfadsf

    

div.alert.error {
background:url("v3.png") no-repeat scroll 7px -643px #FFEEEE;
}

选择器“div.alert.error”是否表示以下内容？

选择包含课程提醒和错误的DIV。

之间是否存在差异？

CaseI:   div.alert.error
CaseII:  div.alert .error
CaseIII: div .alert .error

谢谢

Answer 1

CaseI:   div.alert.error

包含班级alert和error的div。 <div class="alert error">

CaseII:  div.alert .error

类error的元素，它是具有类alert的div的后代。

CaseIII: div .alert .error

具有类error的元素，它是具有类alert的元素的后代，而该元素又是任何div的后代。

Answer 2

让我以您的案例为例：

CaseI：选择应用了“alert”和“error”类的每个div。

CaseII：选择任何在div中应用了“error”的情况，并在其中应用了“alert”的情况。

案例III：选择任何包含“错误”的案例，该案例属于“警告”类和div的内容。

Answer 3

正如您所猜测的那样，选择器意味着“选择同时具有警报和错误类别的div。”

是的，这三种情况之间也存在差异（已由others概述）。我建议您查看W3C CSS2 selectors document, pattern matching section。

Answer 4

假设，我们想在标签上应用样式。所以我们应该写如下

h1(this is called 'selector')
{
    text-align(property):center(value);
    color:green;

}

现在使用Id选择器和类选择器

1）id选择器

#para1
{
    text-align:center;
    font-face:Bold

}

当我们想要使用写作如下：

    <input type="text" id="para1">