CSS Class& ID结构/命名

时间:2011-05-31 14:33:18

标签: html css syntax

我是一名网络开发人员近2年了,我每天都在学习新事物,但由于我的知识越来越大,我遇到了一些基本问题,无法找到一个很好的讨论。

您如何命名您的DIV,ID,类?你给他们具体的内容相关名字吗? (即<div id="google_map">

或者您是否将他们的名字与他们在网站上的位置相关联? (即<div id="content_top_bar">

你是否也以同样的方式在你的.css中这样做了?

我希望你能得到我想要找到的东西。我想无论如何都没有“真实”的答案,但我想知道一些意见,以便我可以决定采取什么选择并继续使用它。

5 个答案:

答案 0 :(得分:6)

HTML应该尽可能在语义上使用,因此您的类和ID应该根据其内容而不是它们的样式或它们在站点中的位置来命名(这些东西应该能够在不影响HTML的情况下进行更改。

例如,如果您命名<div id="left-sidebar">然后决定要移动该元素,则id不再在语义上表示该元素。相反,如果您命名为<div id="navigation"><div id="article">,则无论其位置或样式如何,它们仍将代表该元素。

答案 1 :(得分:3)

我会根据对象的内容命名对象(无论是物理的逻辑)。您关心的是 的对象,而不是 的位置。

上述规则的例外是当对象形成页面的布局时,但在这种情况下它不应该真正具有名称,除非你打算操纵页面结构以在运行时移动东西 - 时间(很好,很少见)。

此外,我发现自己还没有命名很多对象,而是为它们分配类,特别是对于我必须一起操作的相关对象。它使得通过jQuery(或您选择的任何框架)与它们一起工作变得更加容易。

答案 2 :(得分:2)

我认为这个问题有一个明确的答案:哪一种最适合你:)

需要考虑的一些事项:

  • 你是唯一一个在代码文件中写作的人吗?
  • 您网站的结构是静态的还是动态的?

根据这些,您可以选择选择英文名称或您自己的语言,或者您可以选择命名div“content”而不是“div_homepage”。

希望这有用:)

答案 3 :(得分:1)

由于HTML是针对内容的,因此您的命名应该引用内容。

答案 4 :(得分:0)

取决于html元素代表的内容:

  • 元素是布局的一部分,将其命名为代表布局部分的内容。 例如:'footer_top_bar'

  • 该元素用于特定内容,将其命名为代表内容的内容。 例如:'comment', 'navigation', 'breadcrumbs'.