bootstrap-sass_源码解析四:Utility

前三节中我们已经讲了Bootstrap-sass的结构,常量的提取,以及混入的定义。

没有什么难度,或许自己看源码来得更加清晰。但是我写这篇文章的目的在这里声明下,主要是:

  • 引导自己耐心得看完组件的所有内容;
  • 结合OOCSS等理论基础,理解和学习bootstrap的css组织结构和书写思想,为自己写css提供参考;
  • 列举bootstrap中的所有组件,常量,混入,以及工具,作为查询手册贡献给大家,是大家在使用bootstrap开发过程中不至于重复制造汽车轮子。

好了,废话不多说,这节我们将解析bootstrap中所有提供的Utility。

内容:

utilities

Bootstrap提供的可以直接使用的工具class

|-- Floats                   //浮动相关
    |-- clearfix             //清除浮动
    |-- center-block         //block元素居中
    |-- pull-right           //右浮动
    |-- pull-left            //左浮动
|-- Toggling content          //切换内容相关
    |-- hide                 //移除
    |-- show                 //出现
    |-- invisible            //不可见
    |-- text-hide            //隐藏文字
    |-- hidden               //同hide
|-- For Affix plugin         //附加导航插件
    |-- affix                 //fix定位

responsive-utilities

响应式布局相关工具class

这部分分两类,一类是根据xs、sm、md、lg四种大小的屏幕控制页面元素的显示和隐藏的class;另一类是控制打印时页面元素是否被打印或隐藏的class;

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值