CSS基础学习-2.CSS选择器(上)
- 元素选择符
- 关系选择符
- 属性选择符
- 伪类选择符
- 伪对象选择符
一、元素选择符
1.通配符:*{ }
2.类选择符:.类名称{ }
3.id选择符::#id名称{ }
4.类型选择符(标签选择符):标签 { }
二、关系选择符
1.子元素选择器:父亲>儿子
2.兄弟选择器::你自己~你的兄弟
3.相邻选择器:E+F
4.包含选择器:E F
三、属性选择符
1.属性
2.写法:
(1)当前元素[属性]{ }
(2)当前元素[属性="属性值"]{ }
四、伪类选择符
1.定义:它允许给htm标签的某种状态没置祥式。
1)元素:link :设置超链接a在未被访问前的样式。
2)元素:visited :设置超链接a在其链接地址已被访问过时的样式。
3)元素:hover:设置元素在其鼠悬停时的样式。
4)元索:active :没置元素在被用户激活(在鼠标点击与释放之间发生的事件)时的样式。
2.注意! ! !
1) a:hover必须位于a:link 和a:visited之后, a:active 必须位于a:hover之后。
2)可靠的顺序是: I(link)ov(visited)e h(hover)a(active)te,即用喜欢(love)和讨厌(hate)连两个歌词来记忆。
五、伪对象选择符
1.元素:before{ }:设置在对象前发生的内容。用来和content属性一起使用,并且必须定义content属性.
2.元素:after{ }:设置在对象后发生的内容。用来和content属性一起使用,并且必须定义content属性。
选择器的优先级
!important>内联>ID>类>标签|伪类|属性选择器>伪对象>继承>通配符
注意:!important要写在属性值的后面,分号的前面。
例:
p{
color:red !important;
}

CSS基础学习-2.CSS选择器(上)的更多相关文章
- CSS基础学习 21.CSS居中总结
注意:*在IE中并不代表通配符的意思,是代表根元素的意思,所以为了匹配适应各种浏览器,进行页面初始化 <style> *{ margin:0; padding:0; } </styl ...
- CSS基础学习 20.CSS媒体查询
- CSS基础学习 19.CSS hack
- CSS基础学习 18.CSS多列
四种常见的浏览器内核:
- CSS基础学习 17.CSS动画
- CSS基础学习 16.CSS过渡
- CSS基础学习-15-1.CSS 浏览器内核
- CSS基础学习-14 CSS visibility与overflow属性
- CSS基础学习-13.CSS 浮动
如果前一个元素设置浮动属性,则之后的元素也会继承float属性,我觉得这里说是继承不太对,可以理解为会影响到之后的元素,所以在设置浮动元素之后的元素要想不被影响就需要清除浮动.元素设置左浮动,则清除左 ...
随机推荐
- web代码审计题
@题名:code i春秋https://www.ichunqiu.com/battalion wp:https://www.ichunqiu.com/writeup/detail/4139
- vue-wechat-title动态修改title
在使用Vue制作项目的过程中,发现title没有变化 所以使用vue-wechat-title插件动态修改tilte 一.安装 npm vue-wechat-title --save 二.引入和使用 ...
- 快速排序的Python代码实现
选择一个数,和它后面的数比较,把比它小的放在它的左边,大的在右边(位置可能会因为左边元素的添加而右移) def quick_sort(arr): if arr==[]: return[] else: ...
- 【转帖】Office的光荣历史(2)
Office的光荣历史(2) https://www.sohu.com/a/201411215_657550 2017-10-31 10:57 7.MS Office 2000 (Office 9.0 ...
- 第二章 impala基础使用
第二章 impala基本使用 1.impala的使用 1.1.impala-shell语法 1.1.1.impala-shell的外部命令参数语法 不需要进入到impala-shell交互命令行当中即 ...
- springboot 论坛项目
项目演示地址:http://www.mawen.co/ 快速搭建sprintboot项目 运行第一个springboot项目 leaf package hello; import org.spring ...
- crontab中的%
crontab中的%是换行的意思,在使用时需要使用\做转义. ----------------- 在用crontab执行一段定时任务时,想要把数据输出到一个日期命名的文件中 * * * * * cd ...
- 使用python连接mysql数据库——pymysql模块的使用
安装pymysql pip install pymysql 使用pymysql 使用数据查询语句 查询一条数据fetchone() from pymysql import * conn = conne ...
- Fiddler之WebFroms的中文乱码问题
乱码问题:修改注册表 1.windows+R ,输入regedit ,按enter键 2.进入这个目录:HKEY_CURRENT_USER\Software\Microsoft\Fiddler2 3. ...
- Codeforces 1244F. Chips
传送门 显然可以注意到连续的两个相同颜色的位置颜色是不会改变的,并且它还会把自己的颜色每秒往外扩展一个位置 同时对于 $BWBWBW...$ 这样的序列,它每个位置的颜色每一秒变化一次 然后可以发现, ...