![](https://csdnimg.cn/release/download_crawler_static/88502693/bg1.jpg)
CSS学习第二天
1. Emmet语法
1. 快速生成HTML结构语法
i. 生成标签 直接输入
标签名+TAB键
即可;比如
div+TAB键
,就可以生成
<div> </div>
。
ii. 想要生成多个相同标签 加上
*
就可以;比如
div*3
就可以快速生成
3
个div。
iii. 有父子级关系的标签,可以用
>
; 比如
ul > li
即可。
iv. 有兄弟级关系的标签,可以用
+
; 比如
div + p
即可。
v. 生成带有
类名
或者
id
名字的,直接写
.demo
或者
#two tab键
即可。
vi. 生成的
div
类名是有顺序的,可以用自增符号
$
;例如
.demo$*5
。
vii. 生成标签内部写内容可以用
{}
表示,例如
div{$}*3
。
2. 快速生成CSS样式语法
基本采取简写形式即可,每个单词的第一个字母即可。
i. 比如
w200 + tab键
可以生成
width:200px
;
ii. 比如
lh26 + tab键
可以生成
line-height:26px
。
2.CSS复合选择器
两个或多个基础选择器,通过不同的方式组合而成。
1. 后代选择器(重要)
又称为包含选择器,可以选择父元素里面的子元素,(包括儿子和孙子)。写法:外层标签写前面,内层标签写后面,中间用空格分开。当
标签发生嵌套时,内层标签就成为外层标签的后代。
元素1 元素2 {样式说明;}
ul li a {样式说明;} /*选择ul标签里面li标签的a标签元素*/
2. 子选择器(重要)
只能选择元素最近一级子元素,用大于号隔开,即亲儿子元素。
元素1 > 元素2 {样式说明;}
div > p {样式说明;} /*选择div里面所有最近一级 p 标签元素*/
3. 并集选择器(重要)
可以选择多组标签,同时为他们定义相同的样式,通常用于集体声明,用逗号隔开,任何形式的选择器都可以作为并集选择器的一部分。
元素1 , 元素2 {样式说明;}
ul,div {样式声明;} /* 选择ul和div标签元素*/
4. 伪类选择器
用于向某些选择器添加特殊的效果,比如给链接添加特殊效果,或选择第1个,第n个元素。用冒号表示。
链接伪类选择器
选择 含义
a:link 选择所有未被访问的链接
a:visited 选择所有已访问的链接
a:hover 选择鼠标指针位于其上的链接
a:active 选择活动链接(鼠标按下未弹起的链接)
严格按照 LVHA 顺序声明。
css