CSS

1.css选择器
a.基本选择器
i.ID
ii.类选择器
ii.标签选择器
b.其他选择器
i. .classname空格div 当前元素所有后代元素-子子孙孙
ii. .classname>div 当前元素下一级所有子元素-只有子代
iii. .classnameA~.classnameB 当前节点A之后的元素B
c.伪类选择器
i. ：hover鼠标经过时设置其样式
ii. ：action鼠标按下时设置其样式
iii. :visited选择器已访问的链接，并设置其样式-针对a标签
2.css优先级
a.style属性>ID选择器>class选择器>标签
b.就近原则，同级别选择器则取最新属性生效
3.盒子模型
a.盒子水平排列-maegin无重合
b.盒子垂直排列-margin重合
c.盒子样式
i.border:1px dashed #red
ii.padding:1px 1px 1px 1px 顺时针方向，从上往下
iii.margin：0 auto
4样式
a.文本样式-font
i.Font-family,font-size,font-weight
ii.text-align:left,center,right
iii.line-height:数值///
iv.Text-decoration:none/underline/overline/line-through
b. 背景样式-background
i.background-color:#ffffff #fff rgb(255,255,255)white 16进制（1,2...A,B,C,D,E,F） ff=15*15^1+15*16^0=255
ii.background-image:url(()
iii.background-repear:no-repeat/repeat-x/repeart-y
iv.background-position：
1）top left(第一个值上中下，第二个字左中右）
2）X%y%(第一个水品位置，第二个垂直位置）左上角为0%,0%,右下角为100%，100%；之规定一个值则另一个值为50%
3）XPx YPx
v.Background-size
1)length:长度，如果只设置一个值则第二个值会被设置为auto
2）percentage:百分比，如果之设置一个值则第二个值会被设置为auto
3）cover：覆盖背景，保持横纵比
4）contain：图片不超过标签范围的情况下变成最大，且保持纵横比
C布局样式
i.文档流 即文档的排列方式：在同一个平面中从左到右，从上到下排列
ii.脱离文档流 盒子模型脱离文档流的文档排列方式，从同一平面中浮起来，根据一定要求排列
iii.浮动
1）float
2）clear：both
iv.定位-position
1）position与top，bottom，left,right联用
2）ABsolute：绝对定位，相对于静态定位（static）以外的第一个父元素进行定位，若在非静态内则以该非静态元素为定位
3）Fixed：绝对定位，是相对于浏览器窗口为进行定位，即有滚动条时页面效果相对静止类似登陆弹框
4）Relative：相对定位，相对于其原本自身正常位置进行定位，即left：20px会向元素的left位置添加20像素，以其本身原本的位置
5）static：默认值
6）inherit:规定应该从父元素继承position属性的值
7)sticky：h5-粘性定位，left，top不设置时不脱离文档流，设置后类似fixed效果
V.盒子层次-index属性，数值越高越在顶层
vi.呈现形式
1）block：块级标签-可设置宽高，元素独占一行
2）inline：行级标签-不可设置宽高，元素自适应内部内容
3）inline-block:介于前两个之间，可设置宽高，但不独占一行