ID和CLASS有什么区别?

分享人:火建强

1.背景介绍

2.知识剖析

3.常见问题

4.解决方案

5.编码实战

6.扩展思考

7.参考文献

8.更多讨论

1.背景介绍

在 CSS 中,选择器是一种模式,用于选择需要添加样式的元素。

要使用css对HTML页面中的元素实现一对一,一对多或者多对一的控制,这就需要用到CSS选择器。

HTML页面中的元素就是通过CSS选择器进行控制的。

2.知识剖析

css中的选择选择器有很多种,包括元素选择器、类选择器、id选择器。在细分还有很多类型的选择器。

类选择器用在对文档要应用样式而不考虑具体涉及的元素时,首先对文档进行标记,输入class属性并且指定一个值,在使用的时候只要在值的前面加上(.)级可以使用这个类选择器。 id选择器与类选择器相似,只不过要在值的前面加上(#)号。

3、常见问题

id选择器与类选择器的优先级

id选择器的唯一性

4、解决方案

通过继承来的属性 id 的优先级高于 class CSS的优先级顺序: 页面中的style > id > class > 继承的属性 一个元素同时应用多个class,后定义的优先(即近者优先),加上!important者最优先!

总结

在一般情况下: 我们利用class来为元素添加样式----css

我们利用id来为元素添加行为----js/jQuery

5、编码实战

6.扩展思考

同一页面使用相同的ID会怎样?

网页JS会报错,同时特效也不会生效。ID选择器特定是具有唯一性,所以实际使用时候无论网页是否特效使用ID,大家都要遵循同一网页只能使用调用一次id。

7.参考文献

参考一:w3school

参考二:jQuery 参考手册 - 选择器

8、更多讨论

如何正确使用ID和CLASS?

鸣谢

感谢大家观看

BY : 火建强