开发者学堂课程【移动Web前端开发:Bootstrap-全局样式】学习笔记,与课程紧密联系,让用户快速学习知识。
课程地址:https://developer.aliyun.com/learning/course/594/detail/8447
Bootstrap-全局样式
一、全局样式
排版:
h1. Bootstrap heading
h2. Bootstrap heading
h3. Bootstrap heading
h4. Bootstrap heading
h5. Bootstrap heading
h6. Bootstrap heading
首先排版的话,当 h1 到 h6,在 Bootstrap 中它有一个默认的样式,如下:
代码:
会通过给它设置一些特定的样式通过标签包裹内联样式的代码片段。
实例
For example,
should be wrapped as inline.
For example,
should be wrapped as inline.
表格也有独属于自己的样子,在原始的默认表格上写上
表格就会转变为当前页面
这是通过类来控制表格,通过类控制表格样式,只需要记住常用的类就好了。
有默认样式的 ,也可加入样式。
隔行换色表格条纹状表格:
添加 table-bordered 类为表格和其中的每一个单元格增加边框。
想要这个格子浮动就添加一个类名,设置鼠标悬停也是一样的操作。
.active 鼠标悬停在行或单元格上时所设置的颜色
.success 标识成功或积极的动作
.info 标识普通的提示信息或动作
.warning 标识警告或需要用户注意
.danger 标识危险或潜在的带来负面影响的动作
下图是表单不同的颜色变换,这些常用的代码样式不需要记住,需要使用时在文档中找到即可。
表单会有一个默认的样式,当加入属性后就会转变为如下样式
按钮
默认样式的按钮或带颜色的按钮都是通过类来实现控制效果的
例 (默认样式)Default
图片
不管什么形状的图片都是通过类来控制的