当涉及到CSS时,<div class="">和<div id="">之间有什么区别?是否可以使用<div id="">?
我看到不同的开发人员用这两种方式来做这件事,因为我是自学的,所以我从来没有真正弄清楚。
当涉及到CSS时,<div class="">和<div id="">之间有什么区别?是否可以使用<div id="">?
我看到不同的开发人员用这两种方式来做这件事,因为我是自学的,所以我从来没有真正弄清楚。
当前回答
在高级开发id中,我们可以使用JavaScript。
为了可重复的目的,类比id更方便,因为id应该是唯一的。
下面是一个例子来说明上面的表达:
<div id="box" class="box bg-color-red">this is a box</div>
<div id="box1" class="box bg-color-red">this is a box</div>
现在你可以在这里看到box和box1是两个(2)不同的<div>元素,但我们可以将box和bg- colour -red类应用于它们。
这个概念是面向对象语言中的继承。
其他回答
任何元素都可以有类或id。
类用于引用某种类型的显示,例如,您可能有一个css类用于表示这个问题的答案的div。因为会有很多答案,多个div将需要相同的样式,你将使用一个类。
一个id只引用一个元素,例如右边的相关部分可能有特定于它的样式,而不是在其他地方重用,它将使用一个id。
从技术上讲,您可以使用所有的类,或者在逻辑上拆分它们。但是,您不能对多个元素重用id。
id在整个页面中必须是唯一的。
一个类可以应用于许多元素。
有时候,使用id是个好主意。
在一个页面中,你通常有一个页脚,一个页眉…
然后页脚可以是一个带有id的div
<div id="footer" class="…"" >
而且还有课
在哪里使用ID而不是类
两者之间的简单区别是,虽然类可以在页面上重复使用,但ID在每个页面上只能使用一次。因此,在标记页面主要内容的div元素上使用一个ID是合适的,因为将只有一个主要内容部分。相反,您必须使用一个类来设置表上的交替行颜色,因为根据定义,它们将被使用不止一次。
IDs are an incredibly powerful tool. An element with an ID can be the target of a piece of JavaScript that manipulates the element or its contents in some way. The ID attribute can be used as the target of an internal link, replacing anchor tags with name attributes. Finally, if you make your IDs clear and logical, they can serve as a sort of “self documentation” within the document. For example, you do not necessarily need to add a comment before a block stating that a block of code will contain the main content if the opening tag of the block has an ID of, say, "main", "header", "footer", etc.
在CSS中,类选择器是一个以句号(“.”)开头的名称,ID选择器是一个以散列字符(“#”)开头的名称。ID和类之间的区别是,ID可以用来标识一个元素,而类可以用来标识多个元素。
或许打个比方有助于理解其中的区别:
<student id="JonathanSampson" class="Biology Calculus" />
<student id="MarySmith" class="Biology Networking" />
学生证是不同的。校园里不允许两个学生使用相同的学生证。然而,许多学生可以并且愿意与其他同学共享至少一个班级。
把多个学生放在一个班级标题下是可以的,比如生物。但把多个学生放在一个学号下是不可接受的。
当通过学校对讲系统发布规则时,你可以向一个班级发布规则:
“明天,所有的学生都要穿一件红衬衫去上生物课。”
.Biology {
color: red;
}
或者你可以给一个特定的学生规则,通过调用他的唯一ID:
“乔纳森·桑普森明天要穿绿色衬衫。”
#JonathanSampson {
color: green;
}
在这种情况下,乔纳森·桑普森收到了两个命令:一个是生物课上的学生,另一个是直接要求。因为通过id属性直接告诉Jonathan穿绿色衬衫,所以他将忽略先前穿红色衬衫的请求。
更具体的选择器获胜。