关于css中的align-content属性详解

作用:

会设置自由盒内部各个项目在垂直方向排列方式。

条件:
必须对父元素设置自由盒属性display:flex;，并且设置排列方式为横向排列flex-direction:row;并且设置换行，flex-wrap:wrap;这样这个属性的设置才会起作用。
设置对象:

这个属性是对她容器内部的项目起作用，对父元素进行设置。

取值:
stretch:默认设置，会拉伸容器内每个项目占用的空间，填充方式为给每个项目下方增加空白。第一个项目默认从容器顶端开始排列。

  
 
 
 
 
Align-content
 
 

#father { 
    
    width : 200px ; 
    display : flex ; 
    flex-direction : row ; 
    flex-wrap : wrap ; 
    align-content : strech ; 
    height : 200px ; 
    background-color : grey ;
} 
.son1 { 
    
      height : 30px ; 
    width : 100px ; 
    background-color : orange ;
} 

.son2 { 
    
    height : 30px ; 
    width : 100px ; 
    background-color : red ;
} 

.son3 { 
    
      height : 30px ; 
    width : 100px ; 
    background-color : #08a9b5 ;
} 


 
 
 




q

      
查看更多关于关于css中的align-content属性详解的详细内容...
        

          
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://www.haodehen.cn/did115347