多语言展示
当前在线:1436今日阅读:176今日分享:34

CSS选择器ID与CLASS的区别是什么?

开发中,很多时候要用到选择器去定位某一个元素,此时我们需要选择正确的选择器,并且要为以后的扩展想好用哪一个,一共常用 两个,id class两种类型选择器,这篇经验分享如何使用它们。
工具/原料
1

IDE编码工具

2

电脑

方法/步骤
1

第一步,先定义一个块级元素,让我们的选择器作用在它上面,代码如下:

这是一个CLASS选择器,还有一个ID如下:
此时页面没有效果

2

定义好之后,分别给两个选择器加上样式,观察他们的区别,样式代码如下:.control{width: 100px;height: 100px;background: red;}.control_id{width: 100px;height: 100px;background: pink;}此时是没有效果的

3

为了验证效果,再加一个同名的class类选择器,代码如下:

control
control
此时,页面上会出现两个一样的样式,ID的则为一个,很明显的看到他们的区别就是,ID只能针对某一个进行控制,CLASS则可以多个。

推荐信息