常用的滑动、隐藏、定位等CSS样式

项目中常用的样式（个人了解的有不对之处多多指教）
基本选择器
组合选择器
后代选取器(以空格分隔)
子元素选择器(以大于号分隔）
相邻兄弟选择器（以加号分隔）
普通兄弟选择器（以破折号分隔）
混合选择器
1、鼠标放上去样式变化
以a标签为例
a:hover{
cursor:pointer;鼠标移动上去变小手；
text-decoration: none;不带下划线
text-decoration: underline;带下划线
color:red；
background:#f6f6f6;//颜色在实战中可以实现当鼠标移动到对应的模块使该模块和其他模块区别开来
}
2、定位
定位属性
position: absolute;绝对定位//相对于整个页面的定位
position: relative;相对定位//相对于父级元素的定位
位置固定后可通过以下几个元素调节具体的位置
left;top;right;bottom
通过float进行定位和display: flex;
用于平级关系之间的位置定位
div默认的循序是从上到下；li标签默认从左到右
文字居中对齐中一定要设置width属性 否则样式不起作用
如果位置发生覆盖
可以在布局中清除浮动动，因为元素浮动后周围的元素都会发生变化。
.clearfix{
content:"";
display:table;
clear:both;
}
3、实现简单的动态渲染
display:block;
display:none;
鼠标放上去显示隐藏内容
.父类：hover .子类{
display:block;
}
放到同级区域显示同级内容可以使用JQuery实现
另一种可以通过透明度控制显示或者隐藏
属性名： opacity: 0;透明不显示。参数为1的时候显示
边框线的设置和鼠标到图片上去图片变大    
box-shadow: 4px 4px 8px 3px #ddd;
不同浏览器下旋转实现属性
transform:rotate(30deg);
-ms-transform:rotate(30deg); /* IE 9 */
-webkit-transform:rotate(30deg); /* Safari and Chrome */
放大或者缩小属性
      -ms-transform: scale(2,3); /* IE 9 */
    -webkit-transform: scale(2,3); /* Safari */
    transform: scale(2,3); /* 标准语法 *
修改边框形状例如椭圆等
 border-radius: 4px;