—这非常适合应用于程序和文档类的网站.(但是经过测试,如果分成两栏,但是内容还是会有重叠)
4 响应式设计
当然很多时候要检测用户使用的屏幕多大,这需要我们检测,使用响应式功能更为方便
在你项目文件中的
里, 添加一个如例子所示的meta标签和一个响应式样式表来开始使用响应式. 如果已经在自定义页面编译好一个Bootstrap, 那么只需添加一个meta标签.
注意! Bootstrap在默认情况下是没有使用响应式功能的, 因为不是任何情况都需要使用到. 我们并不是让开发者移除此功能, 而是最好在需要使用的时候才使用它.
二 基本css
基础的css包括排版,代码输入,表格,表单,按钮,图像,最后还免费提供很多Glyphicons图标。
1 排版
bootstrap对标题h1-h6都进行了修改,还有全局默认的font-size,line-hegiht 以及段内的行间距。
强调 还有html5的
对齐 .text-left .text-center .text-right
强调颜色 规范了五中颜色 text-warning text-error text-info text-sucess
缩写很厉害啦,
利用title属性可以将缩写包围的字母显示全写,attr,以前都要用link实现的
地址管理,
让html更加语义化,毕竟html是超文本标记语言
- Twitter, Inc.
- 795 Folsom Ave, Suite 600
- San Francisco, CA 94107
- P: (123) 456-7890
*css 层叠样式表 cascading style sheets
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Integer posuere erat a ante.
- Someone famous Source Title
列表没变 有序ol 无序 ul,当然还有很多添加的css, .unstyled 无样式, .inline-block水平排列,
2 代码
因为需要一些特殊标记,如<>,所以添加了
For example,
should be wrapped as inline
3 表格
添加属性
.table-striped在表格内部添加条样,间隔一个一个 .table-bordered(圆角) .table-hover在table内部使用停悬效果 .table-condensed 是得单元格padding减半,让表格更加紧凑
同样还是四个颜色 .success .error .warning .info
4 表单
还有文本框、下拉菜单、按钮很多没说出来,自己看文档吧
5 按钮
btn btn-info btn-primary btn-success btn-warning btn-danger btn-inverse btn-link
大小区别 btn-large btn-small btn-mini
6 图像
改变展示样式
7 图标
所有图标都需要一个独特、前缀带 icon-
属性的
标签. 如需使用时, 可直接将以下代码使用在任何地方:
也可以使用风格相反(白色)的图标, 这里准备了一个额外的属性. 我们将具体展示这些属性在导航条和下拉菜单中悬停和活动时候的状态效果.
注意! 当在旁边使用文本, 按钮或导航链接, 为了有一个适当的间距, 请一定要在
后面留一个空格位置.
三 组件
组件有下拉菜单, 按钮组,按钮式下拉菜单,导航(这个使用很多),导航条,路径是导航,分页,标签和标记,排版,省略图,通知,进度条
四 插件
插件可以单独被添加(有些有可能需要依赖), 或一次性全部导入.
bootstrap.js 或
bootstrap.min.js 文件中, 包含了所有插件.
很多js插件,我们可以用一下