css学习day2

1、Emmet语法

1.1 快速生成HTML结构语法

2、css的复合选择器

常用的复合选择器包括：后代选择器、子选择器、并集选择器、伪类选择器

2.1后代选择器：

语法：

元素1 元素2{  声明样式  }

Note：

• 元素1和元素2用空格隔开
• 元素1是父级，元素2是子级，最终选择元素2
• 元素2可以是儿子，也可以是孙子，只要是元素1的后代即可

2.2子选择器：

语法：

元素1>元素2{  声明样式   }

Note：

• 元素1和元素2用>隔开
• 元素1是父级，元素2是子级，最终选择元素2
• 元素2是元素1的所有直接后代（亲儿子）

2.3并集选择器：（选择多组标签，为他们定义相同样式）

语法：

元素1,元素2{

        样式声明

}

2.4伪类选择器 （为元素增加特殊样式）

特点：用：表示

2.4.1链接伪类选择器

 Note：为确保生效，按照LVHA的顺序声明；由于a链接在浏览器中具有默认样式，在实际工作中需要为链接单独制定样式。

 2.4.2   ：focus伪类选择器    （用于选取获得焦点【光标】的表单元素，主要针对input表单元素）

input：focus{

        background-color：yellow；

}

3、css的元素显示模式

元素显示模式就是元素（标签）以什么方式进行显示。

3.1 HTML元素一般分为块元素和行内元素两种类型。

 Note：

文字类元素里面不能放块元素

 行内块元素：<img/> <input/> <td>

 3.2  元素显示模式转换

• 转换为块元素   display：block
• 转换为行内元素   display：inline
• 转换为行内块元素   display：inline-block

css背景复合写法：

背景透明度   rgba（0，0，0，0.5）