html - html/css 带有多个点的元素是什么意思

Question

如果我想应用多个 css 类，我会使用<div class = "c1 c2 c2">
我正在查看一些代码。是什么<div class = "c1.c2.c3">意思？

Answer 1

您拥有的代码是正确的，但是您不需要第二个<div>元素 ( <div class='c1.c2.c3'></div>) 中的点。（除非您实际上有一个明确命名为 c1.c2.c3 的元素，这可能会导致 CSS 样式声明出现一些问题，除非您转义前导斜杠）

圆点指的是 CSS 样式规则，表示一个元素有多个类，或者在本例中为类 c1、c2 和 c3。

.c1.c2.c3
{
    //Styles an element that has classes c1, c2 and c3
} 

.c1.c2
{
    //Styles an element that has classes c1 and c2
}

而使用间距，它细化了范围：

.c1 .c2 .c3
{
    //Styles an element that has class c3 within an element c2, 
    //within an element c1.
}

两种情况的示例

Answer 2

<div class = "c1.c2.c3">就是它的样子：这个 div 元素的类名是c1.c2.c3. 它的 CSS 选择器如下所示：

.c1\.c2\.c3 {
    // styles here
}

这与 的 CSS 选择器非常不同<div class="c1 c2 c3">，看起来像这样：

.c1.c2.c3 {
    // styles here
}