CSS常用样式总结

目录

1.阴影

2.鼠标滑过实现元素上移效果

3.before，after伪元素用法

4.css隐藏滚动条

5.径向渐变

6. 宽高自适应(适配)

---

1.阴影

box-shadow: 0 3px 7px 0 rgba(0, 0, 0, .1);

参数说明：

值	说明
h-shadow	必需的。水平阴影的位置。允许负值
v-shadow	必需的。垂直阴影的位置。允许负值
blur	可选。模糊距离
spread	可选。阴影的大小
color	可选。阴影的颜色。在CSS颜色值寻找颜色值的完整列表
inset	可选。从外层的阴影（开始时）改变阴影内侧阴影

2.鼠标滑过实现元素上移效果

 li{
     transition: transform 0.1s
 }
 li:hover{
     transform: translate(0,-10px)
 }
 translate表示移动，第一个参数为水平移动值，第二个参数为垂直移动值

3.before，after伪元素用法

:before选择器在被选元素内容之前插入内容，必须配合content属性来指定要插入的内容