码迷,mamicode.com
首页 > Web开发 > 详细

Css 技巧

时间:2017-06-01 19:31:41      阅读:277      评论:0      收藏:0      [点我收藏+]

标签:span   rom   blog   div   display   block   技巧   position   column   

1. 瀑布流布局

.parent {
    -moz-column-count: 4; /* Firefox */
    -webkit-column-count: 4; /* Safari 和 Chrome */
    column-count: 4;
    -moz-column-gap: 4px;
    -webkit-column-gap: 4px;
    column-gap: 3px;
}

.child{
    display: inline;
    width: 100%;
}

 

2. div 内上下居中

.parent{
    position: relative;
}

.child {
    display: inline-block;
    position: absolute;
    right: 5%;
    top: 33%; /** 通过这个调节 */    
}

 

Css 技巧

标签:span   rom   blog   div   display   block   技巧   position   column   

原文地址:http://www.cnblogs.com/au_ww/p/6930230.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!