Bootstrap V3 重新定义col的宽度

  • Post author:
  • Post category:其他


有的时候col的宽度2列太宽,1列又太窄,那么就需要重新定义一个中间宽度,和标准用法混合使用

对于12列网格,如果要为每个列宽添加一半列(4,16667%).这是你做的.

例如,对于col-md-x,使用以下值定义.col-md-x-5.

.col-md-1-5 { width: 12.5%; } 
.col-md-2-5 { width: 20.83333%; }
.col-md-3-5 { width: 29.16667%; }
.col-md-4-5 { width: 37.5%; }
.col-md-5-5 { width: 45.83333%; }
.col-md-6-5 { width: 54.16667%; }
.col-md-7-5 { width: 62.5%; }
.col-md-8-5 { width: 70.83333%; }
.col-md-9-5 { width: 79.16667%; }
.col-md-10-5 { width: 87.5%; }
.col-md-11-5 { width: 95.8333%; }

舍入了某些值.

其次,为避免从原始col-md-x复制css代码,请在类声明中使用它们.请注意,应在修改之前添加它们.这样,只有宽度被覆盖.

<div class="col-md-2 col-md-2-5">...</div>
<div class="col-md-5">...</div>
<div class="col-md-4 col-md-4-5">...</div>

最后,不要忘记总数不应超过12列,总计100%.



版权声明:本文为cm2010_03_31原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。