html - 我应该如何命名我的 CSS 类？

Question

我的类(class)名称应该如何命名？

例如，一个用于投票计数的 CSS 类，我应该如何命名它？

.vote-count-post     (1) // SO uses this
.VoteCountPost       (2)
.voteCountPost       (3)
.vote.count-post     (4)
.vote .count-post    (5)
.vote .count.post    (6)

• 各自的优缺点是什么？
• 哪个最常用，为什么？
• 这些有任何影响吗？
• 我的 CSS 中可以有任何大写字母吗？

Answer 1

4、5、6比较特殊

• .vote.count-post 匹配具有 class="vote count-post" 或 class="count-post vote" 的元素> 甚至 class="vote something-else count-post"。
• .vote .count-post 匹配具有 class="count-post" 的元素，这些元素是具有 class="vote"
• 和.vote .count.post是两者的混合

在 1、2 和 3 之间，重要的是风格偏好。有些人喜欢一种语言，就像他们在编程语言中所做的那样。因此，只需选择您个人喜欢的或更适合您的即可。