CSS样式实战

CSS样式实战

1、position，dispaly，float属性对比

float:left;(左浮动)他使得指定元素脱离普通的文档流而产生的特别的布局特性。并且FLOAT必需应用在块级元素之上，也就是说浮动并不应用于内联标签。或者换句话来说当应用了FLOAT那么这个元素将被指定为块级元素

CSS样式实战

float:left;(左浮动)他使得指定元素脱离普通的文档流而产生的特别的布局特性。并且FLOAT必需应用在块级元素之上，也就是说浮动并不应用于内联标签。或者换句话来说当应用了FLOAT那么这个元素将被指定为块级元素

2、position属性使得元素块居中。

根据position的绝对定位

将

    1 .content {
 2     padding:10px;
 3     background:green;
 4     color:#fff;
 5     position:absolute;
 6     top:50%;
 7     left:50%;
 8     border-radius: 5px;
 9     -webkit-transform: translate(-50%,-50%);
10     -moz-transform: translate(-50%,-50%);
11     transform:translate(-50%,-50%);
12 }