CSS类和ID结构/命名

问题描述

| 我是一名Web开发人员，已经有将近2年的时间了，我仍然每天都在学习新事物，但是由于我的知识越来越广，所以我遇到了一些基本问题，因此找不到很好的讨论。 您如何命名自己的DIV，ID，类？您是否给他们指定与内容相关的名称？ （即

<div id=\"google_map\">

） 还是您根据他们在网站上的位置来命名他们？ （即

<div id=\"content_top_bar\">

） 并且您是否以相同的方式在.css中执行此操作？ 我希望你能得到我想找出的答案。我想仍然没有“真”答案，但是我想知道一些意见，以便我可以决定采取哪种选择并在将来继续使用它。     

解决方法

        HTML应该在语义上尽可能地被使用，因此您的类和ID应该根据其内容而不是其样式或它们在网站中的位置来命名（这些内容应该能够在不影响HTML的情况下进行更改。 例如，如果命名为

<div id=\"left-sidebar\">

，然后又决定要移动该元素，则ID不再在语义上代表该元素。相反，如果命名为

<div id=\"navigation\">

或

<div id=\"article\">

，则无论它们在页面上的位置或样式如何，它们仍将表示元素。     ,        我会根据对象的内容（无论是物理上的逻辑）来命名对象。您关心对象不在何处。 上面规则的一个例外是当对象形成页面的布局时，但是在那种情况下，它实际上并没有一个真正的名字，除非您打算操纵页面的结构在运行时移动内容（很好，只是很少见）。 我也发现自己并没有为很多对象命名，而是为它们分配了类，尤其是对于我必须一起操作的相关对象。它使通过jQuery（或您选择的任何框架）与他们合作变得容易得多。     ,        我认为这个问题有明确的答案：哪种方法最适合您：) 要考虑的一些事情： 您是代码文件中唯一的写作吗？ 您网站的结构是静态的还是动态的？ 根据这些内容，您可以选择选择英文名称或您自己的语言，也可以选择将div命名为“内容”，而不是例如“ div_homepage”。 希望对您有所帮助:)     ,        由于HTML用于内容，因此您的命名应引用内容。     ,        根据html元素表示什么： 元素是布局的一部分，将其命名为代表布局的那部分的名称。 例如：

\'footer_top_bar\'

元素用于特定内容，将其命名为代表内容的名称。 例如：

\'comment\',\'navigation\',\'breadcrumbs\'.