html css中id和class的区别比较

如题所述

1、语法区别:

id对应css是用样式选择符“#”(井号)。

class对应css是用样式选择符“.”(英文半角输入句号)。

2、使用次数区别:

id属性,只能被一个元素调用(以“#”选择符命名CSS样式在一个页面只能使用调用一次)。在同一个页面,只可以被调用一次,在CSS里用“#”表示。

class类标记,可以用于被多个元素调用(以“.”选择符命名样式可以一个页面使用多次)是类标签,在同一个页面可以调用无数次(没限制的),在CSS里用“.”表示。

ID就像一个人的身份证,用于识别这个DIV的,Class就像人身上穿的衣服,用于定义这个DIV的样式。一般一个网页不设二个或二个以上同ID的div,但Class可以多个DIV用同一个Class。

3、语义和使用不同:

id作为元素的标签,用于区分不同结构和内容,而class作为一个样式,它可以应用到任何结构和内容上。在布局思路上,一般坚持这样的原则:id是先确定页面的结构和内容,然后再为它定义样式:而class相反先定义一类样式,然后再页面中根据需要把类样式应用到不同的元素和内容上面。

参考资料来源:百度百科-CSS语法 

温馨提示:内容为网友见解,仅供参考
第1个回答  2016-08-14
class可以在页面里面重复使用,
id由于在页面里面只能出现一次,所以不能重复使用,
所以尽量用class来写,这样能在页面里面重复引用你写的css,减小工作量和代码量。

这种情况尽量用id:页面大的模块里面,用id来区分不同的模块。
比如页面里面有这样的模块:最新新闻,推荐新闻等。就可以考虑用id来区分。

还有一点,由于id是页面中唯一的,更多的是定义来留给给页面里面的javascript用。

补充:class和id在页面里面的使用方法:
class:
<style type="text/css">
.footer{background:red;}
</style> <div class="footer">footer</div>
id: <style type="text/css">
#footer{background:red;}
</style>
<div id="footer">footer</div>

定义class的css是用点:“.”,如.footer
定义id的css是用井号“#”,如#footer

//让div居中对齐

让div内的内容(包括文字及图片)居中的代码是: text-align:center;

<style type="text/css">
刚刚入门,要记住。

.align-center{
margin:0 auto; /* 居中 这个是必须的,,其它的属性非必须 */
width:500px; /* 给个宽度 顶到浏览器的两边就看不出居中效果了 */
background:red; /* 背景色 */
text-align:center; /* 文字等内容居中 */
}
</style>本回答被提问者和网友采纳
第2个回答  2016-08-14
.是类 #是id
id是唯一的,类是可以重用的.
比如你有多个地方样式要求一样的话,就用类.这样就不用些多个#了.
.name{.....}
<div class="name"></div>
<div class="name"></div> /*就像这样.你多个地方都想要同一个样式就这样写.

#Idname{.......}
<div id="Idname"></div> /*id只有一个.
第3个回答  2020-04-23
class可以被重复调用,而id不可以

html css中id和class的区别比较
1、语法区别:id对应css是用样式选择符“#”(井号)。class对应css是用样式选择符“.”(英文半角输入句号)。2、使用次数区别:id属性,只能被一个元素调用(以“#”选择符命名CSS样式在一个页面只能使用调用一次)。在同一个页面,只可以被调用一次,在CSS里用“#”表示。class类标记,可以用于被多...

id和class的区别
2、CSS中优先级不同。在CSS选择器中,对id和class的样式应用优先级不同。id的样式优先级要高于class的样式优先级。3、跳转功能。使用id属性可以增加锚标记跳转功能,而class没有这个功能。id是身份标识号、账号、唯一编码、专属号码、工业设计、国家简称、法律词汇、通用账户、译码器、软件公司等各类专有...

CSS 的 ID 和 Class 有什么区别?如何正确使用它们
1.ID是页面中唯一的,而class可以多个,(如下图),1位置引号中只有2个,css5和css5_class,而2位置引号中就只能有一个 css5_id 2.ID要设置样式时用“#”号定义,而class用“.” 号定义。3.ID的优先级大于class 比如说在同一个标签中,id样式中定义了文字颜色为红色,class文字颜色为绿色。结...

HTML设置CSS时class和id的用法与区别是什么?
除了优先级不同之外,id和class最大的区别还在于——同一项目内,id的值是唯一的,而class则可以相同。 例如下面的代码17行,id值重复而导致报错。

CSS class 和id有什么区别?
1、可标识元素数量:id只可用于标识一个元素,而class可用于标识多个元素。2、元素可添加数量:每个元素只能有一个id,而可以在同一元素上使用多个class。3、选择器上的区别:在CSS中,class选择器是一个以点(“.”)开头的名称,而ID选择器是一个以哈希字符 (“#”)开头的名称。使用class选择器...

css里面,id和class的区别是什么?看了很多解释,就是不懂,什么叫id只能用...
CSS里面定义ID与Class格式与用途的不同具体(例子)有:定义格式不同:形如ID="aaa"定义的,在css中是这样设置其样式的:#aaa{ 样式列表 }以Class="bbb"形式定义的,在CSS中应该这样设置其样式:.bbb{ 样式列表 } 用途不同:Class元素分2种,关联的和独立的。关联的用于html的相关tag,比如:h1....

CSS中Class与ID的区别,Margin与Padding的区别
以下是我的一些理解:1. Class与ID的区别一个Class是用来根据用户定义的标准对一个或多个元素进行定义的。打个比较恰当的比方就是剧本:一个Class可以定义剧本中每个人物的故事线,你可以通过CSS,Javascript等来使用这个类。因此你可以在一个页面上使用class="Frodo" ,class="Gandalf",class="Aragorn"...

css里面应该用id还是class??
这个还是有点说法的,id是可以用来布局的,比如说<div id="header"><\/div> , <div id="footer"><\/div>...等,这样的语义比较明确,class一般是用来做样式的,也更有利于在javascript中控制样式。如果你是一个网页的唯一开发者,那么id和class都无所谓,通过id能精确的找到某一个元素,id也可以...

CSS中的ID与Class:选择器与样式的奥秘
在CSS(层叠样式表)中,ID与Class是两种关键选择器,对于样式精准控制及复用至关重要。探索它们的差异与应用,成为开发者必备技能。首先,ID选择器以“#”开头,后接元素的唯一ID。每个HTML元素的ID确保独特性,ID选择器特异性高,精准定位单元素。如:通过#uniqueElement,仅针对id为"uniqueElement"的...

Css 中class和ID的区别是什么?看了挺多解释都没看懂好多例子都有span...
class 表示同一个类型,id是指向具体的某一个标记,也就是说class里面包含了很多id。比如两个标记,class都是 class1 ,然后class1设置背景色为红色,那么你这两个标记的背景色都是红色的,如果你取出其中一个标记的id,根据id将这个标记的背景色设置成蓝色,那这个标记背景色就成了蓝色,而另一个...

相似回答