速解CSS选择器

速解CSS选择器,第1张

目录

标记选择器

类选择器

 ID选择器


标记选择器

一个网页有很多的标记,

、、等等,标记选择器用于声明这些标记,它的语法格式如下

tagName{

porperty:value;

}

首先是声明标签,在标签里面设置对应的属性和属性值,在CSS中设置的属性必须在CSS的范围内,不然就会导致语句不会生效。标记选择器会控制全部的同类标记,例如当声明了的样式为蓝色,那么页面所有的标签都会编程蓝色。

类选择器

类选择器的作用就是来弥补标记选择器的不足,标记选择器会将同类的标签内容都变为相同的样式,如果我们想在所有的标签中把一部分的字体变为红色,另一部分的字体变为蓝色,就要使用类选择器。

.className{

porperty:value;

}

我们来看一个例子




    
        
        
    
    
    神王盖伦
    大保健
    

盖伦是美国RiotGames开发的3D大型竞技场战网游戏《英雄联盟》中的一位英雄。
/*使用了special1风格*/ 即使装备非常破烂,但他还是拥有强大的攻防能力。虽然非常强力但在专业比赛中他坐冷板凳很久,不过玩家开始注意起盖伦。
盖伦是最强力的半肉dps之一。

科技大厦打开

qwer

在上面的一段代码中我们就使用了这两个CSS选择器来美化页面(好像我的美化水平不怎么样阿),

 改变CSS的风格

 ID选择器

我们直接来看代码边看边讲




    
        
        
    
    
    神王盖伦
    大保健

对线神王德莱厄斯

盖伦是美国RiotGames开发的3D大型竞技场战网游戏《英雄联盟》中的一位英雄。
/*使用了special1风格*/ 即使装备非常破烂,但他还是拥有强大的攻防能力。虽然非常强力但在专业比赛中他坐冷板凳很久,不过玩家开始注意起盖伦。
盖伦是最强力的半肉dps之一。

科技大厦打开

qwer

  

在HTML中ID选择器只能使用一次,而上面的代码我使用了两次ID选择器,大家如果在VScode中运行这段代码会发现“对线德莱厄斯”这句话不会再浏览器当中显示出来,将代码

对线神王德莱厄斯

改为

对线神王德莱厄斯

就可以显示出来。

欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/web/1297967.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2022-06-10
下一篇 2022-06-10

发表评论

登录后才能评论

评论列表(0条)

保存