html - 声明 CSS 类的正确方法是什么？与以下方法有什么不同？

Question

声明 CSS 类的正确方法是什么？与以下方法有什么不同？

1) div.classname { }
2) .classname { }

标签： htmlcss

Answer 1

两者都是有效的，但以不同的方式使用：

• .classname：样式将应用于每个具有类的元素classname
• element.classname：样式将应用于此元素元素的每种类型，具有类classname

---

例子：

.class {
  width: 100px;
  height: 100px;
  background-color: blue;
}

div.class {
  background-color: yellow;
}

<div class="class"></div>
<section class="class"></section>
<p class="class"></p>