BootStrap框架
BootStrap框架采用的是栅格式布局,12格,每列的距离用百分比,以适应不同的屏幕,格子与格子的间距为30px;
width:1000px !important
}
//container为我们要布置的内容区域,可以并列存在多个,但是不能嵌套。
row:行
col-xs-num//num为数字1——12,此行的意义是定义元素所占的宽度
col-xs-push-num//num为数字,把元素向右推num格,不会影响原先排在他后面的元素
col-xs-pull-num//num为数字,把元素向左推num格,不会影响原先排在他前面的元素
col-xs-offset-num//把元素及右边的元素一起向右推num格。
嵌套的规则:
行套列,列套行,不能行套行,列套列。
使用BootStrap框架,只需要找到自己想要的代码,在自己页面中改变class值即可。
BootStrap框架的更多相关文章
- Bootstrap框架的学习(一)
一.Bootstrap框架介绍 Bootstrap是一个非常优秀的前端UI框架,一个轻量级的UI前端框架,是基于HTML+CSS+JavaScript的框架. 二.简单介绍 Bootstrap框架是属 ...
- Web前端学习笔记:Bootstrap框架
很久之前就有很多人给我推荐twitter的Bootstrap框架,但是直到前几天我才真正学习了下Bootstrap,的确是相当棒的框架,至少从视觉体验上超越了很多以前碰到了前端UI框架.今天我要聊聊B ...
- 基于BootStrap框架构建快速响应的GPS部标监控平台
最近一个客户要求将gps部标平台移植到bootStrap框架作为前端框架,符合交通部796部标只是他们的一个基本要求,重点是要和他们的冷链云物流平台进行适配.我自己先浏览了客户的云物流平台的界面,采用 ...
- Bootstrap框架(基础篇)之按钮,网格,导航栏,下拉菜单
一,按钮 注意:虽然在Bootstrap框架中使用任何标签元素都可以实现按钮风格,但个人并不建议这样使用,为了避免浏览器兼容性问题,个人强烈建议使用button或a标签来制作按钮. 框架中提供了基础按 ...
- Bootstrap框架(基础篇)之列表,表格,表单
继续上篇的基础部分延伸,主要说一下列表,表格,表单相关Bootstrap框架变化以及基础知识. 1.列表篇 除了HTML提供的三种基本列表样式: 无序列表 <ul> <li>… ...
- Bootstrap框架(基础篇)
本文引用慕课网http://www.imooc.com/learn/141 作者大漠 讲的很详细,我没有全篇都引用,其中很多是添加了自己的一些理解. Bootstrap框架是基于JQuery 所以 ...
- bootstrap框架禁用谷歌字体
bootstrap框架禁用谷歌字体 H5框架换字体.png
- css去掉使用bootstrap框架后打印网页时预览效果下的超链接
在我们写网页的时候,超链接是链接各个页面的桥梁,也是搜索引擎爬虫(spider)收录网站页面的关键,因此,在每个网页中会有许多的超链. 今天,一个同行妹妹在使用了bootstrap框架来搭建自己的网站 ...
- 响应式设计,bootstrap框架的IE兼容问题
学习bootstrap框架,主要是为了集成好的响应式框架,及其兼容性. 但是按bootstrap中文站的说明文档 制作了一个栅格布局的test.html后,怎么测试都不成功,在ie8下一直看不到媒体查 ...
随机推荐
- HTML5 十大新特性(二)——表单新特性
H5的表单新特性可以分为两大类. 一.10个input的type值 1.email:邮件输入域,在表单提交时提供简单的邮箱格式验证,并弹出一个提示窗口. 2.url:地址输入域,在表单提交时提供简单的 ...
- python3 不同目录间模块调用
#Author by Andy #_*_ coding:utf-8 _*_ #__file__获取当前程序的相对路径 import os,sys #print(__file__) # os.path. ...
- Java数组扩容算法及Java对它的应用
1)Java数组对象的大小是固定不变的,数组对象是不可扩容的.利用数组复制方法可以变通的实现数组扩容.System.arraycopy()可以复制数组.Arrays.copyOf()可以简便的创建数组 ...
- 前端优化之图片延迟加载(lazyload.js)
要想缩短首屏加载时间,思路一般是减少http请求次数和降低每次的请求量.本文中使用现成的lazyload.js插件,文末会放出下载地址. lazyload.js可以实现图片分批次加载,不是一次性加载完 ...
- 解决因为使用了官方xbean-2.4.0.jar 的库造成的性能问题
最近我们游戏经常收到玩家投诉卡进度条的问题.而且后台显示执行队列和CPU使用率异常高 根据调用的JDB分析出 使用xbean 时候会调用以下代码 在设置xmlobject 时候会有一个 GlobalL ...
- server and client
server: using System;using System.Collections.Generic;using System.Linq;using System.Text;using Syst ...
- 手机客户端UI测试常见的测试点
1.各种分辨率下,显示正常.现市场上主流的塞班V3系统手机为240*320.320*240.WM系统主要为240*320.320*480.Android系统主要为320*480,Iphone系统为32 ...
- [并查集] POJ 1611 The Suspects
The Suspects Time Limit: 1000MS Memory Limit: 20000K Total Submissions: 35206 Accepted: 17097 De ...
- C# 4.0 新特性dynamic (待学习)
随便翻看了一下dynamic,在网上拷贝了一个例子,先贴出来等有空了再慢慢消化 static void Main(string[] args) { dynamic d = new MyDynamicO ...
- 【PCB】扫盲总结
1.PCB是什么 PCB( Printed Circuit Board),中文名称为印制电路板,又称印刷线路板,是重要的电子部件,是电子元器件的支撑体,是电子元器件电气连接的载体.由于它是采用电子印刷 ...