今天写点很平常的CSS——这么平常，那为什么要说呢？
因为我们知道不一定就会记得，我们在开发中是很少使用的，突然碰到，却想不起来，最后还是去查文档，问度娘，所以今天出一期这样的，让我们在碰到时直接就可以拿出来使用
废话不多说，我们开始：
目录
一.音频（audio）常用属性：
src:地址；
loop="loop":循环播放
controls="controls":向用户显示播放控件
autoplay="autoplay":自动播放
二.视频（video）常用属性
首先，上面音频属性在视频中都适用，我们再来添加几个：
width & height:宽、高
poster = "imgurl":在加载等待时显示出来的图片
muted = "muted":静音播放
preload = "auto"(预先加载视频) / "none"（不预先加载视频）
当我们使用autoplay自动播放时，就不需要添加preload属性了
*这里需要注意的是：谷歌浏览器默认当你视频有声音的时候，你的自动播放是不起作用的，也就是默认不自动播放，我们可以通过将视频静音，便可以在谷歌浏览器上实现视频的自动播放
三.修改表单placeholder提示信息的文本属性：
input::placeholder{
color: red;
} 需要注意的是：这里是双冒号
四.CSS盒子模型
我们经常遇到这样的问题：我设置了一个盒子，宽高200px，本来是没有问题的，但是当我给了盒子10px的边框border，又给了10px的内边距padding，这时当我们检查元素的时候会发现，盒子变大了，宽高都变成了220px，那这肯定就是边框和内边距搞的鬼啊，有没有什么好的解决办法呢？
有！CSS有这么一个属性可以完美的解决这个问题
box-sizing: content-box / border-box;
我们发现有俩个值，我们选择border-box就可以解决内边距和边框将盒子撑大的事件了，一般我们会放在全局变量里，方便快捷
五.图片模糊处理
这个真的可以算一个冷门属性了，但有时真的很好用
filter:函数( );
filter: blur(5px);【blur为模糊函数，数值越大，越模糊】
六.CSS计算盒子宽度calc函数
width: calc(100% - 100px);【加减乘除都可以使用】
不过如果我们后期使用LESS的话，这个属性可以说没有用处了，非常的鸡肋，了解一下就可以了
七.图片背景的缩放
background-size: 背景图片宽度 背景图片高度;
background-size:cover; //完全覆盖，可能有一部分显示不全
bakground-size: contain; //把图像扩展到最大尺寸，直到其宽高完全适应内容区域（当一边顶到头时，另一边不再拉伸）
八.浏览器私有前缀
-moz- //firefox私有
-ms- //ie私有
-webkit- //safair、chrome私有
-o- //Opera私有
我们举一个例子，在火狐浏览器中实现一个圆角属性：
-moz-border-radius: 10px;九.最高权重
!important
举一个例子：
img{
height:100%!important;
}意思就是最高的权重，无论前面给这个元素套了多少层的权值，无论多么的天花乱坠，只要跟上!important，那就是我权重最高（尽量不用，不建议频繁使用）
十.线性渐变
background：linear-gradient（to 起始方向，颜色1，颜色2......）
background：linear-gradient（角度值deg，颜色1，颜色2......）
background：linear-gradient（颜色百分比，颜色2百分比......）
background：linear-gradient（to 起始方向，颜色1百分比，颜色2百分比......）
background：linear-gradient（角度值deg，颜色1百分比，颜色2百分比......）
*如果不显示的话，可以尝试在linear前加上浏览器的私有前缀
3004
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
