Question

为什么属性[class="classname"]的课程选择会被课程.classname选择到位？在考虑跨电子邮件客户端兼容的电子邮件时，这有什么好处吗？

编辑：我完全了解每个选择器的工作原理，但是，我试图弄清楚是否存在选择按属性选择的原因是出于兼容性原因（特别是在类属性的情况下）由于css和电子邮件客户端的问题，由一个类组成。在查看响应式电子邮件模板之后出现了这个问题，该模板明确使用了按类选择属性的类选择。

e.g。

.red-text { color: red }
[class="red-text"] { color: red }


<td class="red-text">This text is red</td>

Answer 1

这些不等同。

[class="a"]将与<div class="a">匹配，但不会与<div class="a b">匹配。

.a将匹配<div class="a">和<div class="a b">。

例如：

div.green {
    color: #0f0;
}

div[class="red"] {
    color: #f00
}

<div class="green"> green </div>
<div class="green bold"> green with other classes </div>

 --

<div class="red"> red </div>
<div class="red bold"> red with other classes &lt;-- I'm broken </div>

Answer 2

.classname会匹配此元素，但[class="classname"]不会。

<div class="foo classname other">
    hello world
</div>

对于电子邮件，[class =＆＃34; classname＆＃34;]优于.classname

2 个答案: