html - html/css id 和类的标准命名约定是什么？

Question

关闭。这个问题是 opinion-based .它目前不接受答案。

---

想要改进这个问题吗？ 更新问题，以便 editing this post 提供事实和引用来回答它.

关闭去年。

社区审核了是否要重新打开此问题9 个月前 并关闭:

原始关闭原因未解决

Improve this question

这取决于您使用的平台，还是大多数开发人员建议/遵循的通用约定？

有几种选择:

1. id="someIdentifier"' - 看起来与 javascript 代码非常一致。
2. id="some-identifier" - 看起来更像是类似 html5 的属性和 html 中的其他内容。
3. id="some_identifier" - 看起来与 ruby​​ 代码非常一致，并且仍然是 Javascript 中的有效标识符

我认为上面的 #1 和 #3 最有意义，因为它们与 Javascript 配合得更好。

这个问题有正确答案吗？

Answer 1

没有。

我一直使用下划线，因为连字符会弄乱我的文本编辑器 (Gedit) 的语法突出显示，但这是个人喜好。

我已经看到了所有这些约定。使用你认为最好的那个——看起来最好/最容易阅读的那个，以及最容易打字的那个，因为你会经常使用它。例如，如果您的下划线键位于键盘底部(不太可能，但完全有可能)，那么请使用连字符。只做最适合自己的。此外，所有这 3 个约定都易于阅读。如果您在团队中工作，请记住遵守团队指定的约定(如果有)。

2012 年更新

随着时间的推移，我改变了我的编程方式。我现在使用驼峰式 (thisIsASelector) 而不是连字符；我觉得后者相当丑陋。使用任何你喜欢的，随着时间的推移很容易改变。

2013 年更新

看起来我喜欢每年都把事情搞混......在切换到 Sublime Text 并使用 Bootstrap 一段时间后，我又回到了破折号。现在对我来说，它们看起来比 un_der_scores 或 camelCase 干净得多。 我原来的观点仍然存在:没有标准。

2015 年更新

这里有个有趣的带有约定的极端案例是Rust .我真的很喜欢这种语言，但是如果你使用 underscore_case 以外的任何东西定义东西，编译器会警告你。您可以关闭警告，但有趣的是编译器默认强烈建议约定。我想在大型元素中它会导致代码更简洁，这不是坏事。

2016 年更新(you 要求)

我采用了BEM我 future 元素的标准。类名最终变得非常冗长，但我认为它为类和与之配套的 CSS 提供了良好的结构和可重用性。我想 BEM 实际上是 一个标准(所以我的 no 可能会变成 yes )但它仍然取决于你决定在一个元素。最重要的是:与您的选择保持一致。

2019 年更新(you 要求)

在很久没有写 CSS 之后，我开始在一个使用 OOCSS 的地方工作。在他们的一种产品中。我个人觉得到处乱扔垃圾是一件很不愉快的事，但不必一直在 HTML 和 CSS 之间跳转感觉很有效率。

不过，我仍然选择 BEM。它很冗长，但是命名空间使得在 React 组件中使用它非常自然。它也非常适合在浏览器测试时选择特定元素。

OOCSS 和 BEM 只是其中的一些 CSS 标准。选择一个适合你的 - 它们都充满了妥协，因为 CSS 只是不是那么好。

2020 年更新

今年的更新很无聊。我仍在使用 BEM。由于上述原因，我的立场与 2019 年更新相比并没有真正改变。使用适合您的方法，根据您的团队规模调整并尽可能多地或尽可能少地隐藏 CSS 的不良功能集。