遇到的css样式
| background-color |
#000000黑 #ffff00 黄 #ff0000 红 #00ff00绿 #0000ff蓝 不能被继承，默认值为 transparent 透明 |
| color | |
| text-align | left、right、center、justify、inherit 设置对齐方式 |
| font-size | xx-small、x-small、small、medium（默认）、large、x-large、xx-large smaller、larger length、%、inherit |
| font-family |
设置字体类型 normal(正常) italic(倾斜) |
| font-style | normal、italic、oblique、inherit 设置字体风格 |
| background |
在一个声明中设置所有的背景属性 可以其他属性设置其中，中间用空格隔开 |
| background-image | 设置背景图像 |
| background-position |
设置背景图像的起始位置 top、bottom、left、right 和 center 还可以使用长度值，如 200px 或 10cm，也可以使用百分数值 |
| background-repeat |
设置背景图像是否平铺 默认repeat 背景图像将在垂直方向和水平方向重复 repeat-x 背景图像将在水平方向重复 |
| background-attachment |
设置背景图像是否固定或随着页面的其余部分滚动 scroll默认，背景会随页面内容滚动。 fixed 背景不动，只滚动内容的效果 |
| direction | ltr、rtl、inherit 设置文本方向 |
| line-height | normal、number、length、%、inherit 设置行高 |
| text-indent | length、%、inherit 设置文本缩进 |
| letter-spacing | normal、length、inherit 设置字符间距 |
| word-spacing | normal、length、inherit 设置字间距 |
| text-transform | none、uppercase、lowercase、capitalize、inherit 处理文本大小写 |
| white-space | normal、pre、nowrap、pre-wrap、pre-line、inherit 规定如何处理空白 |
| text-decoration | none、underline、overline、line-through、blink、inherit 设置文本修饰 |
| font | font-style、font-variant、font-weight、font-size（或 line-height）、font-family 在一个声明中设置所有的字体属性 |
| font-weight | normal（默认）、bold、bolder、lighter、inherit 100、200...900（400=normal，700=bold） 设置字体粗细 |
| font-variant | normal、small-caps、inherit 以小型大写字体或者正常字体显示文本 |
| box-shadow | none | inset（可选值，不设置，为外投影 | 设置，为内投影） x-offset（阴影水平偏移量，正值阴影右边，负值阴影在左边） y-offset（阴影垂直偏移量，正值阴影在底部，负值阴影在顶部） blur-radius（阴影模糊半径，只能为正，0为无模糊效果，值越大，越模糊） spread-radius（阴影扩展半径，可正可负） color |
display:flex |
将盒子变成弹性盒子。一个盒子如果一旦变成弹性盒子以后，内部默认就会有两根轴，分别是row横轴与column纵轴 |
flex-direction |
设置弹性盒子内部弹性的方向，也叫设置弹性盒子主轴方向 row横向【默认值】 column纵向 row-reverse column-reverse |
justify-content |
设置弹性盒子内部元素的主轴方向排列 flex-start弹性开始的方向【默认值】 flex-end弹性结束的方向 center居中 space-between空格隔开 space-around空格环绕 space-evenly中间的空间平均隔开 |
align-items |
设置弹性盒子内部元素的副轴方向排列 该属性主要使用于主轴没有换行的情况 flex-start副轴弹性开始的方向 flex-end副轴的弹性结束方向 center居中 baseline基线对齐 stretch拉伸【默认值】 |
flex-wrap |
弹性盒子内部的主轴方向是否允许换行 nowrap不允许换行 wrap当主轴方向排列不下的时候会出现折行的现象
|
flex-flow |
这个属性是flex-direction与flex-wrap的综合属性，第一个属性值代表弹性方向（主轴方向），第二个代表主轴是否换行 |
align-content |
多主轴设置（也叫副轴上面的主轴设置） 该属性主要用于主轴出现了折行以后使用 flex-start弹性开始 flex-end弹性结束 center居中 space-between空格隔开 space-around空格环绕 space-evenly空格平均分 stretch拉伸 |
align-self |
单独设置当前元素的副轴排列，它的属性值与align-items保持一致 |
| order | 用于设置子级元素在主轴上面的排列，根据从小到大的顺序进行排列 ，默认值是0 order的数值越大就排在弹性的尾部 |
| flex | 该属性是设置元素在主轴方向占剩余空间的比例。该属性非常重要，它适用于弹性布局里面的页在的盒子的大小切割 |
