css 相关整理

1. Positon: absolute 绝对定位(以父盒子定位)    
: relative  相对定位(以自己定位)	    					    
: fixed    固定定位(浏览器)        				
: static   取消定位   
     			 
2. vertical-align: 方向  图片文字对齐方式
:top 顶部对齐
:middle 中间对齐
:bottom 底部对齐
3.Float: 方向(浮动)
:left 左浮动
:right 右浮动

3.clear:both  清除浮动  (给后面兄弟 )
overflow:hidden  (给父盒子)
4.cursor:pointer 手型  
:help  帮助
:relative 等待
5. Z-index: 层级  					 
  -zoom:1(ie专用可清除margin的重叠)	

6.-webkit-transform:scale(0.6)  缩放  (让网页支持小于12号字)

7、Text-shadow: x  y 羽化 尺寸 颜色 位置‘默认外，inset内’(投影)

8、Text-align:justify(文字两端对齐)                      
Text-justify:inter-ideogragh(文字两端对齐)		   		
Text-decoration: none,line-through (去除下划线)   	
: underlin(添加下划线)		
text-indent:  单位em(文本缩进)               		
Font-weight: normg(文字不加粗) 				   		
:bold (文字加粗)					   		
Font-style:none (清除自带样式)		  
:italic(斜体)				     
:normg(正常)					   
:normal(字体样式为空)		  
:字体名字(字体)			   
Font-size: x (文字大小)	
9、opacity: 0.5(透明度)	

10、Box-shadow: x  y 羽化 尺寸 颜色 位置‘默认外，inset内’(投影),......可多个
background:#ffffff(背景色)	   
 background:rgba(r, g, b, 0.2)(背景色透明度)	   
background:#ffffff url(地址) x y no-repeat不平铺, url(地址)x yrepeat平铺;(多背景)	
background-position: right bottom, left top;(多图背景定位)
background-size:80px 60px，80px 60px;(多背景大小)  
:0(特殊),cover(等比例),contion(其中一边满)
 background-origin:content-box内容:border-box边框:padding-box内边距(背景起源)   
 background-clip::content-box内容:border-box边框:padding-box内边距(切图起源)
background: linear-gradient(to 方向, 色1 ,色2,.....);（背景渐变）

11、Line-heighe:    (行高)			 			
Letter-spaing:   (字间距)	   
word-wrap:break-word(文本换行)  
white-space: nowrap(文本不换行) 
text-overflow:clip(默认剪切)
:ellipsis(多行文字溢出[…]实现)					
12.x::before {content:””} 在盒子前添加内
x::after{content:””}在盒子后添加内

13.font-family:myFirstFont(字体)						
@font-face											
{													
font-family: myFirstFont;								
src: url('字体文件路劲'),url('字体文件路劲'); /* IE9 */   ：
}
14.:last-child最后一个 :nth-child()其中一个 
:empty里面没有内容的 :only-child 只有一个
>子代 ~后面的兄弟 +紧邻 :first-child第一个
：not()排除  [class]所有class 
[class=“tot”]class为tot [class^="a"]以开头 
[class$="b"]以b结束	


15.Transform:translate(x,y); 移动 						
[:translateX(x),:translateY(y),:translateZ(z)]		
:scale(x倍数,y倍数);缩放								
[:scaleX(n)改变宽,:scaleY(n)改变高]		  			
:skew(角度deg);倾斜[:skewX(n),:skewY(n)]	 			
:matrix(旋转,缩放,移动,倾斜,x, y);合并      		
:rotate(角度deg);旋转										
[:y轴X(n)改变宽,:rotateY(n),rotateZ(n)]					
																			
:origion(x,y)转换起源.通常用于缩放				
:scale3d(x,y,z)                              
:translate3d(x,y,z)											
:rotate3d(x,y,z,angle)						    		
perspective：20；开启透视								 		
transform-style: preserve-3d;开启3D效果						
perspective-origin: x-axis y-axis;3D效果位置					
backface-visibility：hidden；背面可见  

曲线：linear 匀速,ease慢下来,
ease-in加快,ease-out减慢,ease-in-out线快后慢
transition: name 运行时间s 曲线 开始时间s;(过渡)
animation:name动画时间 曲线 开始时间 循环infinite 反向alternate
@keyframes name{
(0%)from {background: red;}
(100%)to {background: yellow;}}
animation-play-atate:pausd 鼠标经过暂停
overflow: hidden;盒子超出隐藏
visibility: hidden;隐藏站位
display: none; 隐藏不站位  display: block;显示和行转块
:liling 块转行
:liling -block 块内行