好得很程序员自学网

<tfoot draggable='sEl'></tfoot>

CSS笔记padding,margin为百分比计算时的参照对象-青草圆

div的padding为百分比的两种情况


padding-top,padding-bottom,margin-top,margin-bottom是百分比时是按照当前元素的 父级元素的宽度 来计算的

1. 当子div的宽度是百分比时

html代码

 
 
  
 
 无标题 
 
html,body{
margin:0;
padding:0;
height:100%;
}

.container{
width:100%;
} 
.row{
width:100%;
}
.row:before ,
.row:after{
  display: block;
  content:'';
  height: 0;
  clear:both;
}
.col-md-4{
  float: left;
  width:33.33%;
}
.blue-bg,
.red-bg,
.yellow-bg{
  padding-top:33.333%;
}
.blue-bg{ background-color: #428bca; } .red-bg{ background-color: red; } .yellow-bg{ background-color: yellow; }

查看更多关于CSS笔记padding,margin为百分比计算时的参照对象-青草圆的详细内容...

  阅读:34次