css相关知识

一、Emmet语法

1、快速生成HTML与CSS

自动排序：.demo$*5
标签中有内容：div{ $ }*5，$左右没有空格，此处为了让符号显示出来
5行标签：div{文字}*5

二、background、box-shadow

background-attachment: scroll / fixed （背景图像滚动 / 固定）

1、background简写：
background：背景颜色 图片地址 背景平铺 背景图滚动 背景图位置
background：pink url() repear-x fixed center top;
2、background半透明：
background：rgba()
3、box-shadow简写：
box-shadow：水平阴影位置 垂直阴影位置 模糊距离 模糊尺寸 颜色 内阴影

默认是外隐形，可省略不写。其中颜色可以使用rgba方式

三、单/多行文字溢出

1、单行文字溢出

white-space: nowrap强制一行显示
overflow: hiddem溢出隐藏
text-overflow: ellipsis 省略号显示

2、多行文字溢出
较大兼容问题，适合webkit浏览器或移动端（内核是webkit）

overflow: hiddem
text-overflow: ellipsis 
display:-webkit-box 弹性伸缩
-webkit-line-clamp:2 限制展现行数
-webkit-box-orient:vertical 垂直

四、圆角边框

border-top-left-radius:10px 左上圆角

文字放大时抗锯齿：-webkit-font-smoothing:antialiased

五、结构伪类选择器

nth-child(even/odd/2n/2n+1) 若n为所有
5n n+5后五个 -n+5 前5个
first-of-type

六、transition过渡

transition简写：属性(可略) 时间 曲线 过渡延迟
属性：transition-property:all / width
时间：transition-duration
曲线：transition-timiny-function:ease 默认/ linear 匀速
过渡延迟：transition-delay