div类与ID

时间:2020-03-05 18:59:09  来源:igfitidea点击:

当使用div时,什么时候最好使用class vs id?

最好使用类,比如说HTML中的字体变体或者元素吗?然后使用id作为结构/容器?

这是我一直不确定的事情,任何帮助都将是很大的。

解决方案

回答

当我们想将相似的样式应用于许多不同的div或者元素时,这些类非常有用。当我们要寻址用于格式化或者使用javascript更新的特定元素时,id是很好的选择。

回答

ID应该是唯一的。类应该共享。因此,如果我们有将应用于多个DIV的CSS格式,请使用一个类。如果只是一个(作为要求,不是偶然),请使用ID。

回答

如果要在页面上的多个位置使用该样式,请使用一个类。如果我们想为单个对象进行大量自定义,例如在页面侧面说一个导航栏,则最好使用id,因为我们在其他任何地方都不太可能需要这种样式组合。

回答

ID必须是唯一的,但在CSS中,在确定要遵循的两条冲突指令中的哪一条时,它们也具有优先权。

<div id="section" class="section">Text</div>
#section {font-color:#fff}
.section {font-color:#000}

文字为白色。

回答

id应该是页面上元素的唯一标识符,这有助于对其进行操作。应该在一个以上的元素中使用的任何外部CSS定义的样式都应放在class属性上

<div class="code-formatting-style-name" id="myfirstDivForCode">
</div>

回答

为要在页面上进行特定操作的唯一元素使用id,为可以在页面其他部分重用的元素使用class。

回答

使用id来标识页面上将只有一个实例的元素。例如,如果我们将单个导航栏放置在特定位置,请使用id =" navigation"

使用" class"对所有以某种方式表现的元素进行分组。例如,如果我们希望公司名称在正文中以粗体显示,则可以使用" <span class ='company'>"。

回答

id属性用于元素在文档中唯一地标识它们,而class属性可以具有由同一文档中的许多元素共享的相同值。

因此,实际上,如果每个文档中只有一个要使用样式的元素(例如,#title),请使用id。如果可以使用多个元素,请使用class。

回答

我想说,每当我们认为要在页面上重复样式元素时,最好使用一个类。 HeaderImage,FooterBar之类的项目可以很好地用作ID,因为我们只使用一次即可,并且可以防止意外复制,因为有些编辑器会在ID重复时提醒我们。

如果我们要动态生成div元素,并希望将特定项目定位为格式,那么我也可以看到它的帮助。我们可以在生成时为其提供适当的ID,而不是先搜索元素然后更新其类。

回答

要理解的最重要的事情是ID必须是唯一的:页面中仅应存在一个具有给定ID的元素。因此,如果我们要引用特定的页面元素,则通常是最好的用法。

如果我们有多个在某种程度上相似的元素,则应使用elements类进行标识。

一个非常有用的,令人惊讶的鲜为人知的事实是,我们实际上可以通过在类名称之间放置空格来将多个类应用于单个元素。因此,如果发布的问题是当前登录用户写的,则可以使用<div class =" question currentAuthor">进行标识。

回答

HTML标准本身回答了问题:

没有两个对象可以具有相同的ID,但是任意数量的对象可以具有相同的类。

因此,如果我们只想将某些CSS样式属性应用于单个DIV,则该ID为ID。如果要将某些样式属性应用于多个DIV,则必须是一个类。

请注意,我们可以将两者混合使用。我们可以使两个DIV属于同一类,但给它们不同的ID。然后,我们可以将通用样式应用于这两个类,并将特定于两者的样式应用于它们的ID。浏览器将首先应用类样式,然后应用ID样式,因此ID样式可以覆盖以前设置的任何类。

回答

类是指我们可能在页面上多次使用的样式,ID是定义元素特殊情况的唯一标识符。标准规定,ID在一个页面中只能使用一次。因此,当我们要在页面中的多个元素上使用样式时,应该使用类;而只想使用一次时,应使用ID。

另一件事是,对于类,我们可以使用带有ID的多个值(通过在每个类之间放置空格,例如" class ='blagh blah22 blah'),只能对每个元素使用ID。

为ID定义的样式将覆盖为类定义的样式,因此在中,#uniquething的样式设置将覆盖.what的样式,无论两者是否冲突。

因此,我们可能应该将ID用于标题,标题,"边栏"之类的东西,等等,每页只出现一次的东西。

回答

我的选择余地是将CSS样式以相同方式应用于多个div时,使用类标识。如果该结构或者容器实际上仅应用一次,或者可以从默认值继承其样式,那么我认为没有理由使用类标识。

因此,这取决于div是否为以下之一;例如,一个div代表stackoverflow网站上答案的问题。在这里,我们将要定义" Answer"类的样式,并将其应用于每个" Answer" div。

回答

如果我们使用的是.Net Web控件,则有时仅使用类会容易得多,因为.Net在运行时(使用runat =" server"的情况下)会更改Web contol div id。

使用类可让我们轻松地为字体,间距,边框等使用单独的类来构建样式。我通常使用多个文件来存储单独的类型的格式信息,例如basic_styles.css用于简单的站点范围格式化,ie6_styles.css用于特定于浏览器的样式(在本例中为IE6)等,而template_1.css用于布局信息。

无论选择哪种方法,都应尽量保持一致以帮助维护。

回答

同样,我们给特定ID的元素可以通过例如JavaScript和DOM命令GetElementById进行操作。

总的来说,我发现为所有主要结构div赋予一个ID很有用,即使最初我没有适用的特定CSS规则,我将来也有这种能力。另一方面,对于那些可以多次使用的元素,我使用了类,例如,一个包含图像和标题的div我可能有几个类,每个类的样式值略有不同。

但是请记住,在所有条件都相同的情况下,id规范中的样式规则优先于类规范中的样式规则。

回答

需要记住的其他事项:

  • 使用ASP.Net时,我们无法完全控制元素的ID,因此我们几乎必须使用类(请注意,这比过去更不正确)。
  • 当我们可以帮助时,最好既不使用它们。相反,请指定元素类型及其父类型。例如,可以通过以下方式挑选出div中包含的navarea类的无序列表:
div.NavArea ul { /* styles go here */ }

现在,我们可以使用一个类应用程序为整个导航区的大部分设置逻辑分区。

回答

除了id和class非常适合在单个项目上设置样式与类似的项目集相比,还需要记住另一个警告。它还在某种程度上取决于语言。在ASP.Net中,可以放入Div并具有ID。但是,如果我们使用面板而不是Div,则会丢失ID。

回答

使用ID的另一个好处是可以将其定位到定位标记中:

<h2 id="CurrentSale">Product I'm selling</h2>

将允许我们在其他地方直接链接到页面上的该位置:

<a href="#CurrentSale">the Current Sale</a>

这样做的常见用法是为博客上的每个标题提供带时间戳的ID(例如id =" date20080408"),该ID允许我们专门针对博客页面的该部分。

同样重要的是要记住,id有更多受限制的命名规则,主要是它们不能以数字开头。看到类似的SO问题:什么是html中id属性的有效值

回答

我想我们都知道类是什么,但是如果我们将ID视为标识符而不是样式工具,那么我们不会出错。尝试定位某物时,我们需要一个标识符;如果我们有多个具有相同ID的商品,我们将无法再标识它...

在编写用于ID和CLASS的CSS时,尽可能使用最少的CSS类是有益的,并尽量不要过多使用ID,直到我们必须这样做,否则,我们将一直致力于编写更强大的声明和很快就会有一个充满!important的css文件。

回答

想想大学。

<student id="JonathanSampson" class="Biology" />
<student id="MarySmith" class="Biology" />

学生证是不同的。校园里没有两个学生拥有相同的学生证。但是,许多学生可以并且将彼此共享至少一个班级。

可以将多个学生置于一个班级名称Biology 101下。但是,将多个学生置于一个学生证下是绝对不可接受的。

通过学校对讲机系统提供规则时,可以将规则提供给班级:

"Would the Biology class please wear Red Shirts tomorrow?"
.BiologyClass {
  shirt-color:red;
}

或者,我们可以通过调用特定学生的唯一ID为其指定规则:

"Would Jonathan Sampson please wear a Green Shirt tomorrow?"
#JonathanSampson {
  shirt-color:green;
}

回答

在哪里使用ID与类

两者之间的简单区别是,虽然一个类可以在页面上重复使用,但是一个ID在每个页面上只能使用一次。因此,在div元素上使用一个ID来标记页面上的主要内容是适当的,因为只有一个主要内容部分。相反,我们必须使用一个类来在表上设置交替的行颜色,因为根据定义,它们将被多次使用。

ID是非常强大的工具。具有ID的元素可以是以某种方式操纵元素或者其内容的JavaScript的目标。 ID属性可以用作内部链接的目标,用名称属性代替锚标记。最后,如果我们使ID清晰且合乎逻辑,则它们可以用作文档中的一种自我文档。例如,如果块的开始标记的ID为" main"," header"," footer",则不一定需要在块之前添加注释来说明代码块将包含主要内容。 ", 等等。