详解CSS样式选择器有哪些?

html-css012

详解CSS样式选择器有哪些?,第1张

CSS选择器就是指定CSS要作用的标签,那个标签的名称就是选择器。意为:选择哪个容器。

CSS选择器分类:

标签选择器、类选择器、ID选择器、全局选择器、群组选择器、后代选择器、伪类选择器

1、html标签选择器:

定义:以html标签作为选择器

2、class类选择器:

定义:为HTML标签添加class属性,通过类选择器来为具有此class属性的元素设置css样式。

类选择器也可以对不同类型元素的同一个名称的类选择器设置不同的样式规则:

同一个元素可以设置多个类,之间用空格隔开:

3、ID选择器

定义:为HTML标签添加ID属性,通过ID选择器来为具有此ID的元素设置CSS规则

4、群组选择器

定义:集体统一设置样式

5、全局选择器

定义:所有标签设置样式

HTML文档结构图

6、后代选择器

定义:使用后代选择器设置,之间用空格隔开,后代选择器可以多层。

7、伪类选择器

链接的四种状态:激活状态,已访问状态,未访问状态,鼠标悬停状态。

伪类

说明

:link

未访问的链接

:visited

已访问的链接

:hover

鼠标悬停状态

:active

激活的链接

:hover 用于访问的鼠标经过某个元素时;

:active 用于一个元素被激活时(即按下鼠标之后放开鼠标之前的状态)

伪类选择器的属性:link >visited >hover >active

说明:

1) a:hover 必须置于 a:link和a:visited之后,才有效

2) a:active 必须置于 a:hover之后才有效

3) 伪类名称对大小写不敏感

8、CSS其它选择器

css继承特性,从父元素那继承部分css属性

选择器的优先级

ID选择优先级最高(id选择器定义具有唯一性)

class选择器次之(class选择器可以多个)

元素选择器再次之

其它选择器优先级主要根据定义的先后顺序,最后定义的优先级高

!important 加重选择器的优先级,添加在样式规则之后,中间用空格隔开。

CSS选择器命名规则

1:采用英文字母,数字以及"-" 和 "_" 命名

2:以小写字母开头,不能以数字和"-" 和 "_" 开头

3:使用有意义的命名规范

常用CSS命名

header

页头

main

主体

footer

页尾

nav

导航

sidebar

侧栏

container

容器

column

栏目

title

标签

menu

菜单

submenu

子菜单

*列举常用命名,大家根据自身项目及团队的规则命名

耐心学习基础知识,基础是盖房的根基,必须打结实。

如果您觉得有用,记得在下方点赞、关注、留言,我会定期奉 上更多的惊喜哦,您的打赏支持才是我继续努力的动力,么么哒。

每日分享在学习过程中总结的学习经验,学习笔记,笔试题,HTML,CSS,JavaScript,jQuery教程,Vue教程,PHP教程,TinkPHP教程等,望大家能以学习为目的,每天阅读一篇文章,了解身边的技术。陪有梦想的人一起成长!

1、选择器用于指定CSS样式作用的HTML对象,花括号内是对该对象设置的具体样式。

2、属性和属性值以“键值对“ 的形式出现。

3、属性是对指定的对象设置的样式属性,例如字体大小、文本颜色等。

4、属性和属性值之间用英文“:“连接。

5、多个“键值对”之间用英文“”进行区分。可以用段落和表格的对齐的演示。

CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。CSS 能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力。

扩展资料:

CSS作为一种定义样式结构如字体、颜色、位置等的语言,被用于描述网页上的信息格式化和显示的方式。CSS样式可以直接存储于HTML网页或者单独的样式单文件。

无论哪一种方式,样式单包含将样式应用到指定类型的元素的规则。外部使用时,样式单规则被放置在一个带有文件扩展名_css的外部样式单文档中。

样式规则是可应用于网页中元素,如文本段落或链接的格式化指令。样式规则由一个或多个样式属性及其值组成。内部样式单直接放在网页中,外部样式单保存在独立的文档中,网页通过一个特殊标签链接外部样式单。

1.css是级联样式表是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS目前最新版本为CSS3,是能够真正做到网页表现与内容分离的一种样式设计语言。相对于传统HTML的表现而言,CSS能够对网页中的对象的位置排版进行像素级的精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力,并能够进行初步交互设计,是目前基于文本展示最优秀的表现设计语言。CSS能够根据不同使用者的理解能力,简化或者优化写法,针对各类人群,有较强的易读性。一个完整漂亮网页,就是由html标签与控制这些标签布局和美化功能CSS组成;2.CSS作用和功能CSS可以让网页“穿上漂亮衣服”,CSS可以控制HTML标签对象的css 宽度、css 高度、float浮动、文字大小、字体、css背景等样式达到我们想要的布局效果。CSS功能和作用也就在于此。我们学习CSS其实就是学习HTML标签应用与CSS样式控制。