Bootstrap框架的css 规范(精简归纳)

本文介绍了Bootstrap CSS的编码规范,包括语法细节如缩进、选择器分组、声明顺序等,帮助开发者遵循一致的代码风格。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Bootstrap CSS编码规范

语法

  1. 用两个空格来代替制表符(tab) – 这是唯一能保证在所有环境下获得一致展现的方法。
  2. 为选择器分组时,将单独的选择器单独放在一行。
  3. 为了代码的易读性,在每个声明块的左花括号前添加一个空格。
  4. 声明块的右花括号应当单独成行。
  5. 每条声明语句的 : 后应该插入一个空格。
  6. 为了获得更准确的错误报告,每条声明都应该独占一行。
  7. 所有声明语句都应当以分号结尾。最后一条声明语句后面的分号是可选的,但是,
    如果省略这个分号,你的代码可能更易出错。
  8. 对于以逗号分隔的属性值,每个逗号后面都应该插入一个空格(例如,box-shadow)。
  9. 不要在 rgb()、rgba()、hsl()、hsla() 或 rect() 值的内部的逗号后面插入空格。这样利于从多个属性值(既加逗号也加空格)中区分多个颜色值(只加逗号,不加空格)。
  10. 对于属性值或颜色参数,省略小于 1 的小数前面的 0 (例如,.5 代替 0.5;-.5px 代替 -0.5px)。
  11. 十六进制值应该全部小写,例如,#fff。在扫描文档时,小写字符易于分辨,因为他们的形式更易于区分。
  12. 尽量使用简写形式的十六进制值,例如,用 #fff 代替 #ffffff。
  13. 为选择器中的属性添加双引号,例如,input[type=”text”]。只有在某些情况下是可选的,但是,为了代码的一致性,建议都加上双引号。
  14. 避免为 0 值指定单位,例如,用 margin: 0; 代替 margin: 0px;。

声明顺序

相关的属性声明应当归为一组,并按照下面的顺序排列:

Positioning
Box model
Typographic
Visual

由于定位(positioning)可以从正常的文档流中移除元素,并且还能覆盖盒模型(box model)相关的样式,因此排在首位。盒模型排在第二位,因为它决定了组件的尺寸和位置。

其他属性只是影响组件的内部(inside)或者是不影响前两组属性,因此排在后面。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值