CSS常见选择器用法

路漫漫其修远兮,吾将上下而求索

文章目录

目录

文章目录

一、选择器的功能

二、选择器种类

1.标签选择器

2.类选择器

3.id选择器

4.通配符选择器

5.后代选择器


一、选择器的功能

选择页面中指定的标签元素

二、选择器种类

分为基础选择器(由单个选择器构成)和复合选择器(把多种基础选择器复合起来)

1.标签选择器
 

直接使用标签名 会将所有的同名元素全部应用(难以针对单个元素进行个性化定制)

CSS常见选择器用法_第1张图片
可以看到所有的div标签都引用了这个样式 

CSS常见选择器用法_第2张图片

2.类选择器

在CSS中创建一个类名  这个类名对应一组属性  让定制的元素引用这个类即可

使用class引用这个css  可以对单个元素进行个性化定制

CSS常见选择器用法_第3张图片

3.id选择器

一个标签可以有一个id 这个属性作为标签的身份 标识是唯一的  可以通过id选择器(前面使用#表示这是个id) 拿到指定元素进行CSS样式色设计

CSS常见选择器用法_第4张图片

4.通配符选择器

使用*选中页面上的所有元素 页面内容都会改为红色

* {
color: red;
}

5.后代选择器

后代选择器复合选择器的一种

将上述前三个选择器结合 同时能够体现标签的层次结构

使用.three 找到父标签 对其中的h5(子标签或者是孙子标签)进行样式设计

CSS常见选择器用法_第5张图片

CSS常见选择器用法_第6张图片


 以上就是本文的全部内容了,如果有任何问题欢迎私信改正或交流哦~欢迎大佬们.感谢您的支持

                ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​        ​​​​​​​                       

 

你可能感兴趣的:(CSS,前端,前端,css)