Bootstrap--全局CSS样式之概览
（1）HTML5文档类型
Bootstrap 使用到的某些 HTML 元素和 CSS 属性需要将页面设置为 HTML5 文档类型。在项目中的每个页面都要参照下面的格式进行设置。
Code<!DOCTYPE html>
<html lang="zh-CN">
...
</html>
（2）移动设备优先
Bootstrap3 是对移动设备优先的，为了确保适当的绘制和触屏缩放，需要在 <head> 之中添加 viewport 元数据标签。
Code<meta name="viewport" content="width=device-width, initial-scale=1">
在移动设备浏览器上，通过为视口（viewport）设置 meta 属性为 user-scalable=no 可以禁用其缩放（zooming）功能。这样禁用缩放功能后，用户只能滚动屏幕，就能让你的网站看上去更像原生应用的感觉。注意，这种方式我们并不推荐所有网站使用，还是要看你自己的情况而定！
Code<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
（3）排版与链接
Bootstrap 排版、链接样式设置了基本的全局样式。分别是：
- 为
body元素设置background-color: #fff; - 使用
@font-family-base、@font-size-base和@line-height-basea变量作为排版的基本参数 - 为所有链接设置了基本颜色
@link-color，并且当链接处于:hover状态时才添加下划线
这些样式都能在 scaffolding.less 文件中找到对应的源码。
（4）布局容器
Bootstrap 需要为页面内容和栅格系统包裹一个 .container 容器。我们提供了两个作此用处的类。注意，由于 padding等属性的原因，这两种 容器类不能互相嵌套。
.container 类用于固定宽度并支持响应式布局的容器。
Code<div class="container">
...
</div>
.container-fluid 类用于 100% 宽度，占据全部视口（viewport）的容器。
Code<div class="container-fluid">
...
</div>
以上只是简单的对Bootstrap3的概览
本文参考了bootstrap3 中文文档，更详细的内容，请参考Bootstrap3文档
Bootstrap--全局CSS样式之概览的更多相关文章
- bootstrap全局CSS样式学习
参考http://v3.bootcss.com/css/,根据自己的记忆进行的复述,加深记忆. 首先介绍bootstrap全局CSS样式 只通过使用bootstrap.css,即可获得统一的样式设置. ...
- 响应式布局和BootStrap 全局CSS样式
1.什么是响应式布局 响应式布局是Ethan Marcotte在2010年5月份提出的一个概念,这个概念是为解决移动互联网浏览而诞生的. 简而言之,就是一个网站能够兼容多个终端——而不是为每个终端做一 ...
- 14、响应式布局和BootStrap 全局CSS样式知识点总结-part1
1.什么是响应式布局 响应式布局是Ethan Marcotte在2010年5月份提出的一个概念,这个概念是为解决移动互联网浏览而诞生的. 简而言之,就是一个网站能够兼容多个终端——而不是为每个终端做一 ...
- Bootstrap全局CSS样式之排版
Bootstrap能全然友好的支持html5的文本元素,这里不再赘述,详细可參考我还有一篇文章<html的文本元素总结>,这里主要针对Bootstrap封装好的CSS文本样式做一下汇总. ...
- bootstrap 全局 CSS 样式
http://v3.bootcss.com/css/#less-mixins-utility 深入了解 Bootstrap 底层结构的关键部分,包括我们让 web 开发变得更好.更快.更强壮的最佳实践 ...
- Bootstrap全局CSS样式之表格
.table--基础表格样式. .table-striped--给<tbody>之内的每一行添加斑马条纹样式: .table-bordered--为表格添加边框: .table-hover ...
- Bootstrap全局CSS样式之button和图片
.btn-default--button的默认样式. .btn-primary--button的首选样式: .btn-success--button的成功样式: .btn-info--button的一 ...
- Bootstrap全局CSS样式之表单
.form-control--将单独的表单控件赋予一些全局样式,如默认宽度width:100%. .form-group--包裹表单控件,获得最好的排列: .form-inline--将表单设置为内联 ...
- bootstrap全局css样式
以下从官网抄来的,感觉还是很实用的,运用得好,灵活运用,非常方便快捷,能大大提高开发效率,也为调整不同尺寸的屏幕节省了时间. hidden-xs @media (max-width: 767px){ ...
- 15、响应式布局和BootStrap 全局CSS样式知识点总结-part2
1.表格 <div class="container"> <table class="table "> <thead> &l ...
随机推荐
- Lua和Javascript差异对比
Lua模拟器js方案 1.语法级模拟lua与js语言差异 1.1注释 js 为//,lua为--. 1.2变量js利用val来声明全局变量不存在局部变量,lua则不需要直接定位则为全局变量,local ...
- CCS3.3之DM642开发环境建立
使用的仿真器是SEED-XDSUSB2.0/5V. 之前用的是CCS2.2,换成了CCS3.3的. 1.安装CCS3.3.38.在我安装完后,并没有急着升级,升级的程序是SR12_CCS_v3.3_S ...
- 通过 Azure 媒体服务进行高速编码
Milan Gada Azure 媒体服务首席项目经理 关于 Azure 媒体服务,客户问的最多的一个问题是能否进行高速编码.这个问题现在已经有了肯定的答案,目前有三种不同类型的 Encodin ...
- VisualStudio2013Preview对C++11的支持(转载)
VisualStudio2013Preview对C++11的支持 为期3天的微软Build 2013大会结束了,作为微软一年一度的开发者大会,微软也做足了功夫:很多产品(包括Windows 8.1和V ...
- 数据源加密-JDBC调用方式加密示例
package test; import org.gjt.mm.mysql.Driver; import java.sql.*;import java.util.Properties;import j ...
- JavaScript高级程序设计27.pdf
第11章 DOM扩展 W3C将一些已经成为事实标准的专有扩展标准化并写入规范当中.对DOM的两个主要扩展是SelectorsAPI(选择符API)和HTML5 选择符API 就是根据CSS选择符选择与 ...
- [SAM4N学习笔记]按键程序(中断方式)
一.准备工作: 将上一节搭建的工程复制一份,命名为"6.key interrupt".这一节主要讲如何使用SAM4N的GPIO中断功能,实现按键的中断输入. 二.程序编写 ...
- ubuntu 交换ctrl与caps lock 键
The relevant option is no longer available in the settings menu in Ubuntu 13.10; this has been repor ...
- KMP算法（模板）
话说kmp真的挺难理解的,花了挺大功夫的,恩,找了段好理解的代码,做模板了 int KMP(char *s,char *p){ int ans = -1; nex[0] = 0; int lenp = ...
- Maven使用第三方jar文件的两种方法 转
在Maven中,使用第三方库一般是通过pom.xml文件中定义的dependency从远程repository中下载该库.但是如果库文件是公司内部的库,或者在本地而不能通过远程repository下载 ...