上篇文章给大家说了css的三种不同的引入办法,本日给大家说一下css的三种选择器:标签选择器、类选择器和ID选择器。
那么有人就会问了,什么是选择器?我们写的css样式声明(定义)由两部分组成,形式如下:选择器{ 样式;},在{}之前的部分便是“选择器”,“选择器”指明了{}中的“样式”的浸染工具,也便是“样式”浸染于网页中的哪些元素。比如我们之前写的span{ color:#f00; }中的span就为一个选择器。
(1)标签选择器标签选择器实在便是我们常常说的html代码中的标签。例如html、span、p、div、a、img等等;比如我们想要设置网页中的p标签内一段笔墨的字体和颜色,那么css代码就如下所示:
上面的css样式代码的浸染:为p标签内的笔墨设置颜色为赤色,字体的大小为16px;(详细的css样式我们会在后边讲解,这里先理解下即可)
(2)类选择器类选择器在我们今后的css样式编码中是最常用到的,它是通过为元素设置单独的class来授予元素样式效果。
利用语法:(我们这里为p标签单独设置一个类选择器.content,代码就如下所示)
详细讲解:
1、类选择器都是利用英文圆点(.)开头;
2、每个元素可以有多个类名,,名称可以任意起名(但不要起中文,一样平常都是与内容干系的英文缩写)
3、类选择器只会改变类下的元素样式,而不会改变其它标签的默认样式;
我们上边的页面在浏览器上显示的效果就如下所示:(content下的笔墨内容颜色变成了赤色,字体变成了16px)
(3)ID选择器
ID选择器类似于类选择符,浸染同类选择符相同,但也有一些主要的差异。
利用语法:
详细讲解:
1、ID选择器为标签设置id=\"大众ID名称\"大众,而不是class=\"大众类名称\"大众。
2、ID选择符的前面是符号为井号(#),而不是英文圆点(.)。
3、ID选择器的名称是唯一的,即相同名称的id选择器在一个页面只能涌现一次;
对付css的三种选择器我们本日就先先容到这里,大家在平时可以自己多加练习练习,多闇练下class的利用办法与技巧。
逐日金句:你本日的努力,是幸运的伏笔,当下的付出,是嫡的花开。喜好我的文章的小伙伴记得关注一下哦,每天将为你更新最新知识。