css样式-选择符-伪类-伪元素
添加css三种方式css
一、行内样式测试
二、嵌入样式<style>url
三、连接样式<link>spa
四、import 指令：@import url(css/style.css)get
选择符总体上分为三类：input
上下文选择符it
基于祖先或同胞元素选择一个元素ast
一、上下文选择符class
标签1 标签2import
二、子选择符>
标签1 > 标签2
标签2必须是标签1的子元素
三、紧邻同胞选择符+
标签1 + 标签2
标签2必须紧跟在其同胞标签1的后面
四、通常同胞选择符~
标签1 ~ 标签2
标签2必须跟（不必定紧跟）在其同胞标签1后面
五、通用选择符*
* {}，p *{}
ID和类选择符
基于id和class属性的值选择元素
一、#id
二、.class
ID和类选择符能够快速定位标签，能够跟上线文选择符联合使用
属性选择符
基于属性的有无和特征选择元素
一、属性名选择符
标签名[属性名]
img[title] {}
二、属性值选择符
标签名[属性名="属性值"]
img[title="red flower"] {}
伪类
UI（User Interface,用户界面）伪类
:一个冒号表示伪类，::两个冒号表示CSS3新增的伪元素
一、连接伪类
a:link{}
a:visited{}
a:hover{}
a:active{}
二、:focus伪类
e:focus
e表示任何元素，获取焦点。
<body>
<p>选择符测试,<em>包体测试上次登录水电费金额</em>上下文选择符</p>
:focus伪类：<input type="text" name="" />
</body>
input:focus {
border: 3px solid red;
}
三、:target伪类
e:target
e表示任何元素，若是用户点击一个指向页面中的其余元素的连接，则那个元素就是目标(target)，能够用target伪类选中它。
<a href="#target1">目标</a>
结构化伪类
一、:first-child和:last-child
分别表明一组同胞元素的第一个元素和最后一个
二、:nht-child
e:nth-child(n),如：e:nth-child(3)
表明一组同胞元素的第N个
伪元素
一、::first-letter伪元素
第一个字符
二、::first-line伪元素
第一行
三、::before和::after伪元素
特定元素的前面或后面加特殊内容
- 1. 伪类元素选择符
- 2. css伪元素选择器
- 3. CSS中选择器以及伪类和伪元素选择器
- 4. CSS3伪元素、伪类选择器
- 5. css选择器(常规选择器，伪类选择器，伪元素选择器，根元素选择器)
- 6. CSS 伪类与伪元素
- 7. css伪类和伪元素
- 8. CSS伪类与伪元素
- 9. css伪类与伪元素
- 10. CSS伪类和伪元素
- 更多相关文章...
- • jQuery Mobile CSS 类 - jQuery Mobile 教程
- • XQuery 选择 和 过滤 - XQuery 教程
- • Kotlin学习（二）基本类型
- • 委托模式
-
每一个你不满意的现在，都有一个你没有努力的曾经。
- 1. 伪类元素选择符
- 2. css伪元素选择器
- 3. CSS中选择器以及伪类和伪元素选择器
- 4. CSS3伪元素、伪类选择器
- 5. css选择器(常规选择器，伪类选择器，伪元素选择器，根元素选择器)
- 6. CSS 伪类与伪元素
- 7. css伪类和伪元素
- 8. CSS伪类与伪元素
- 9. css伪类与伪元素
- 10. CSS伪类和伪元素