2018/4/26
1. 高级选择器
E F 后代 F在E内
E>F 子 F是E的子元素
层次： E+F 相邻兄弟 F紧位于E后
E~F 通用兄弟 E后所有匹配的F
E:first-child 作为父元素的第一个子元素的元素E
E:last-child 作为父元素的最后一个子元素的元素E
E F:nth-child(n) 选择父级元素E的第一个子元素F（n可以是
结构伪类 1,2,3，关键字为Even、odd）
E：first-of-type 选择父元素内具有指定类型的第一个E元素
E：last-of-type 选择父元素内具有指定类型的最后一个E元素
E F:nth-of-type(n)选择父级元素E的第n个类型为F子元素
注意：E F:nth-child(n) 在父级从第一个元素开始查找，不分类型
EF:nth-of-type(n) 在父级里先看类型，再查找
E[attr] 具有属性attr的元素E
E[attr=val] 选择匹配具有属性attr且属性值为val（区分大小写）的E
属性 E[attr^=val] ~属性值为以val开头的任意字符串~
E[attr$=val] ~属性值为以val结尾的任意字符串~
E[attr*=val] ~字符串val与属性值中任意位置匹配 ~
2018/4/27
1. li标签紧贴，inline-block,无间隙
2. <span>标签：凸显标签内几个文字或某个词语
3. 并集选择器：P .show,.bird span{}
4. 字体样式：
font-family 类型
font-size 大小 单位：px、em、rem等
font-style 风格 normal、italic、oblique（后两个倾斜程度不同
font-weight 粗细 normal、bold、bolder、lighter
font 在一个声明中设置所有属性 font:italic bold 36px “宋体”
5. p{font-family:Verdana,”楷体”;}
6. 1em等于当前字体尺寸
7. 字体粗细：100~900 normal=400 bold=700
8. 文本属性:
color RGB(16进制)、RGBA(增加Alpha透明度 0-1，用三原色表示，
255,255,255 红绿蓝
Text-align 水平对齐 left、right、center、justify（两端对齐）
Text-indent 首行缩进
Line-height 行高
Text-decoration 文本装饰 none、underline、overline、line-through
9.颜色：3对相同可缩写 eeff66 ef6
10.行高大于或等于字体大小
11.文本阴影：
Text-shadow ：color x-offset y-offset blur-radius(模糊半径)
x
y
2018/4/28
1. 伪类样式：选择器：伪类器名{声明；}
2. 清楚浏览器记录：ctrl+shift+delete
3. 设置伪类顺序：link-visited-hover-active
4. Div块元素，能够指定宽高的一个区域。
5. List-style-type常用值：none、disc（默认，实心圆）、circle（空心圆）、square（实心正方形）、decimd（数字）
6. <ol type=“i”>罗马数字
7. 调样式：F12大法
8. Background-position（关键词可任意组合）
1. Xpos Ypos
2. X% Y%
3. 水平：left、center、right
X、Y方向关键词
垂直：top、center、bottom
9.background：颜色、图像、定位、是否重复
10.渐变需加浏览器前缀
1.IE Trident内核 -ms-
2.Safari/Chrome Webkit -webkit-
3.Opera Blink-o-
4.Firefox Mozilla -moz-
11.radial、linear径向（无方向）、线性
2018/5/2
1.全局选择器 *{margin:0;}
2.网页居中对齐：margin：0auto；
3.ul{padding-left:0;}
4.border-box:盒子宽高等于元素内容宽高
Content-box: 默认 2*(border+padding+margin)+width
2018/5/3
1. border-radius制作圆形：
l 宽、高必须相等
l 圆角半径为元素宽度的一半或50%
2. 上、下半圆：
l 元素的宽度是高度的两倍
l 圆角半径等于元素的高度值
3. 左右半圆：
l 元素的高度是宽度的两倍
l 圆角半径为元素的宽度值
4. 扇形：
l “三同”：元素宽、高、圆角半径相同
l “一不同”：圆角取值位置不同（弧线对应取值位置）
5. 兼容不同浏览器提供的标签的默认距离（使用并集选择器）
（各种标签用逗号隔开） {padding:0;margin:0;}
6.#beautyul li:hover a {color:pink;}
选中li标签，控制其中元素
7.box-shadow:inset(内阴影，删除后是外阴影) x-offsety-offsetblur-radiuscolor
8.标准文档流：指元素根据块元素或行内元素的特性从上到下、从左到右的方式自然排列，这也是元素默认的排列方式。
9.内联元素可以包含于块元素中，反之不成立。
2018/5/4
1. 解决父级边框塌陷的四个方法
1. 浮动元素后加空div（代码冗余）
<divclass="clear"></div>
.clear{
clear:both;
magin:0;
padding:0;
}
2. 设置父元素的高度（影响元素的扩展性）
3. 父级添加overflow属性（有下拉列表框的场景不能用）
visible：默认，溢出内容呈现在盒子之外
hidden：被修剪
scroll：被修剪，显示滚动条
auto：如果被修剪，显示滚动条
4. 父级添加伪类after（稳如老狗）
.clear:after{
content: ''; /*在clear类后添加的内容为空*/
display: block; /*把添加的内容转化为块元素*/
clear: both; /*清除这个元素两边的浮动*/
}
2. class=“myboxclear”在class里面，空格表示多样式
3. 牛客网