Heim > Web-Frontend > HTML-Tutorial > CSS选择器中:类和ID选择器的区别_html/css_WEB-ITnose

CSS选择器中:类和ID选择器的区别_html/css_WEB-ITnose

WBOY
Freigeben: 2016-06-24 11:54:01
Original
1653 Leute haben es durchsucht

相同点:可以应用于任何元素

不同点:

1、ID选择器只能在文档中使用一次。与类选择器不同,在一个HTML文档中,ID选择器只能使用一次,而且仅一次。而类选择器可以使用多次。

下面代码是正确的:

中国是个伟大的国家。。。。。习近平是现任的国家主席

而下面代码是错误的:

中国是个伟大的国家。。。。。习近平是现任的国家主席

2、可以使用类选择器词列表方法为一个元素同时设置多个样式。我们可以为一个元素同时设多个样式,但只可以用类选择器的方法实现,ID选择器是不可以的(不能使用 ID 词列表)。

下面的代码是正确的(完整代码见右侧代码编辑器)

.stress{    color:red;}.bigsize{    font-size:25px;}<p>到了<span <strong>class="stress bigsize"</strong>>三年级</span>下学期时,我们班上了一节公开课...</p>
Nach dem Login kopieren

下面的代码是不正确的(完整代码见右侧代码编辑器)

#stressid{    color:red;}#bigsizeid{    font-size:25px;}<p>到了<span <strong>id="stressid bigsizeid"</strong>>三年级</span>下学期时,我们班上了一节公开课...</p>
Nach dem Login kopieren

到了三年级下学期时.(这样可行)

注意:上面代码可以把color:red和font-size:25px;放在一个类选择器里面,如果既要设置一个词语的颜色为red又要设置它的字体为25px,那就方便多了;但是倘若一个地方只需要设置它的颜色为red,那还要宁谢类选择器,所以说写类选择器时分得越细越好(自认为)!!!


Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage