块级格式化上下文：在父级建bfc，子级浮动导致高度塌陷可以找回高度         overfolw：hidden

常见会触发bfc的：1.根元素  2.folat   3. overolw:auto scroll ,hidden4.display:table-cell, table-caption      inline-block,flex, inline-flex5.position:absolut,fixed 

定位：相对定位，相对于自身的位置移动   postion：relative

绝对定位：脱离文档流  position：absolute

非静态定位：position：relative

固定定位，脱离文档流，以视口为准  position：fixed

z-index 层数和定位一起用 可以把覆盖的内容显示出来

在父级里面 子级相对定位就跑不出去，以包含他的上一级为准

浮动   脱离文档流

float：left/right 左浮动/右浮动   右浮动后顺序会乱 可以先左浮动之后浮动他的父级

去掉无序列表的小圆点：

list-style：none；

　　　　　upper-coman；变成大写

　　　　　lower-roman；变成小写

　　　　　upper-alpha；/lower-alpha   英文大小写

虚线  boder：  px dased 颜色；

点线 boder：  px dotted       ；双实线  boder： px   double

定义四个方向的样式 只需要在  boder-方向  后面的内容同上

长度和宽度一样的话可以用  boder-reius：50%  可以调成圆形

boder-reius：px  px  px  px  可以把四个方向的角 调成圆角

颜色渐变     

    background：linear-gradient（颜色   颜色）

外边框缩进

*{margin：0px；padding：0px}

元素阴影

box-shadow：px  px 模糊值px  外延颜色；

线性渐变

background：linear-gradient（to right，red，yellow）；角度渐变   90deg

径向渐变

 background：radial-gradient（red px；yellow    px）

那些样式需要渐变   匀速

transition：all linear  1s；

循环

@keyframes box1{

from{

      background-----

     }

}

to{background----}

动画属性animation   

infinite  循环次数无线

行内标记准换为块级

display：black

line-height：px

浮动

float：left/rite  左右浮动

右浮动会导致顺序变乱   可以先左浮动  后浮动他的父级

clear：both  清除浮动

子级浮动  父级高度会塌陷  行内元素浮动后会视为块级

在浮动文本元素时候设置宽度

定视口

background：颜色  url（图片路径）  no-repeat不平铺

{

width

height

background：url（）no-repent

}

hover{

background-position：x   y

}

背景图片设置

background-image：url（路径）

平铺方式

none不平铺

横向平铺repeat-x

纵向平铺repeat-y

固定在左上角  background-position：topright；

　固定中间   　　　　　　　　　　　　　　center  center；

　　　　　　　　　　　　　　　　　　　　　　px   px

改变图片大小               size：  100%：100%；

横向铺满    cover；     /contain

固定定主background- attachment：fixed；

文字倾斜

font-style：oblique

加粗

font-weight：bole

改变字体大小

font-weight：normal

文本首行缩进20px

text-indent：20px

词间距

word-spacing：px

词间距

letter-spacing：px

行高

line-height

居中

text-alight：center

加下划线

text-decorationg：underlin

加上划先

overline

字中间划过

变成大写/小写

text-transform：upprecase/lowercase

line-thyough

去下划线

none

我学到了那些HTML5 简单标签