
Bootstrap
flowser
you are what you want to be
展开
-
Bootstrap 排版样式
页面排版1.页面主体Bootstrap将全局:font-size 设置为14px;line-height 设置为1.428(20px);p标签 设置为1/2行高(10px);创建包含段落突出的文本: 添加 class=”lead”,得到更大更粗、行高更高的文本。<!DOCTYPE html><html> <head> <meta charset="utf-8"原创 2017-03-21 20:27:27 · 4617 阅读 · 0 评论 -
Bootstrap 表格和按钮
一.表格1.基本格式<table class="table"></table>2.条纹状表格让< tbody>里的行产生一行隔一行加单色背景效果<table class="table table-striped"></table>3.带边框的表格给表格增加边框<table class="table table-borderd"></table>4.悬停鼠标让< tbody>下的表格悬停鼠标实现背景原创 2017-03-21 21:25:40 · 2494 阅读 · 0 评论 -
Bootstrap 表单和图片
一.表单1.基本格式<form> <div class="form-group"> <label>电子邮件</label> <input type="email" class="form-control" placeholder="请输入您的电子邮箱" /> </div> <div class="form-group"> <la原创 2017-03-22 16:48:28 · 2852 阅读 · 0 评论 -
Bootstrap 环境安装
1.下载Bootstrap2.Bootstrap文档结构预编译的: 源码:3.创建Bootstrap页面<!DOCTYPE html><html> <head> <title>Bootstrap 模板</title> <!--媒体查询 后续介绍--> <meta name="viewport" content="width=device-widt原创 2017-03-21 18:44:34 · 944 阅读 · 0 评论 -
Bootstrap 栅栏系统
栅栏系统是通过定义容器大小,并将其等分12份,通过一系列行(row)与列(column),结合媒体查询制作成强大的响应式栅格系统。工作原理:数据行(row)必须包含在 .container(固定宽度) 或 .container-fluid(100%宽度)中。以便为其赋予合适的排列(aligment)和内补(padding)。通过行(row)在水平方向上创建一组列(column),随着屏幕或视口(原创 2017-03-22 20:27:17 · 8224 阅读 · 1 评论 -
Bootstrap 辅助类和响应式工具
一.辅助类1.情景文本颜色 类 描述 .text-muted 柔和灰 .text-primary 主要蓝 .text-success 成功绿 .text-info 信息蓝 .text-warning 警告黄 .text-danger 危险红2.情景背景色 类 描述 .bg-primary 主要蓝 .bg-success 成原创 2017-03-22 21:10:26 · 613 阅读 · 0 评论 -
Bootstrap 图标
小图标组件Bootstrap提供了的小图标: 可参考Bootstrap中文官网组件原理Bootstrap框架中的图标都是字体图标,是通过css3的@font-face属性配合字体来实现icon效果的。@font-face {font-family: ‘Glyphicons Halflings‘;src: url(‘../fonts/glyphicons-halflings-regular.eo原创 2017-03-22 23:18:36 · 2541 阅读 · 0 评论 -
Bootstrap 3兼容IE8浏览器
文章出处:http://www.ijophy.com/2014/05/bootstrap3-compatible-with-ie8.html转载 2017-04-27 11:09:09 · 1221 阅读 · 0 评论