- 选择器 (个人认为很重要,可以提高效率)
有些描述有些拗口
http://www.w3school.com.cn/cssref/css_selectors.asp
- 媒体查询
响应式必备@media xxx
- 框模型
框大小 box-sizing:border-box; 使设定的宽高中包含padding和border
- 弹性盒子(一种好的居中方式)
弹性盒子由弹性容器(Flex container)和弹性子元素(Flex item)组成。
弹性容器通过设置 display 属性的值为 flex 或 inline-flex将其定义为弹性容器。
http://www.runoob.com/css3/css3-flexbox.html
- 背景和边框
- 边框
border-radius 圆角
box-shadow 阴影
border-image 边框图片- 背景
background-clip 背景图绘制区域
background-size 背景图尺寸
background-origin 背景图定位区域
- 文本效果
hanging-punctuation 规定标点字符是否位于线框之外。
punctuation-trim 规定是否对标点字符进行修剪。
text-align-last 设置如何对齐最后一行或紧挨着强制换行符之前的行。
text-emphasis 向元素的文本应用重点标记以及重点标记的前景色。
text-justify 规定当 text-align 设置为 "justify" 时所使用的对齐方法。
text-outline 规定文本的轮廓。
text-overflow] 规定当文本溢出包含元素时发生的事情。
text-shadow 向文本添加阴影。
text-wrap 规定文本的换行规则。
word-break 规定非中日韩文本的换行规则。
word-wrap 允许对长的不可分割的单词进行分割并换行到下一行。
- 字体
@font-face 自定义字体
- 2D/3D 转换
- 2D
- translate()
- rotate()
- scale()
- skew()
- matrix()
http://www.w3school.com.cn/css3/css3_2dtransform.asp
- 3D
- rotateX()
- rotateY()
http://www.w3school.com.cn/css3/css3_3dtransform.asp
- 过渡
transition
http://www.w3school.com.cn/css3/css3_transition.asp
- 动画
- @keyframes
- animation
http://www.w3school.com.cn/css3/css3_animation.asp
- 多列布局
- columns
- columns-count
- columns-gap
http://www.w3school.com.cn/css3/css3_multiple_columns.asp
- 用户界面 (未理解)
resize
box-sizing
outline-offset
http://www.w3school.com.cn/css3/css3_user_interface.asp