Bootstrap3 排版-页面主体
Bootstrap 将全局 font-size 设置为 14px,line-height 设置为 1.428。这些属性直接赋予 元素和所有段落元素。另外,
<p>(段落)元素还被设置了等于 1/2 行高(即 10px)的底部外边距(margin)。
Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Nullam id dolor id nibh ultricies vehicula.
Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec ullamcorper nulla non metus auctor fringilla. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec ullamcorper nulla non metus auctor fringilla.
Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus. Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit.
<p>...</p>
中心内容
通过添加 .lead 类可以让段落突出显示。
Vivamus sagittis lacus vel augue laoreet rutrum faucibus dolor auctor. Duis mollis, est non commodo luctus.
<p class="lead">...</p>
使用 Less 工具构建
variables.less 文件中定义的两个 Less 变量决定了排版尺寸:@font-size-base 和 @line-height-base。第一个变量定义了全局 font-size 基准,第二个变量是 line-height 基准。我们使用这些变量和一些简单的公式计算出其它所有页面元素的 margin、 padding 和 line-height。自定义这些变量即可改变 Bootstrap 的默认样式。
—–下面有个“顶”字,你懂得O(∩_∩)O哈哈~
—–乐于分享,共同进步!
—–更多文章请看:http://blog.csdn.net/duruiqi_fx
Bootstrap3 排版-页面主体的更多相关文章
- SharePoint 2010 master page 控件介绍(3) :页面主体内容
转:http://blog.csdn.net/lgm97/article/details/6409217 <!-- ===== 页面滚动区域开始 ====================== ...
- CSS排版页面
创建CSS文件如下: @charset "utf-8"; /* CSS Document */ *{ margin:0px; padding:0px; border:0px; } ...
- HTML页面主体常用设置
1.定义网页背景颜色:<body bgcolor="red"> <body bgcolor="#0fc"> 2.设置背景图片: < ...
- Bootstrap3 排版-列表
无序列表 排列顺序无关紧要的一列元素. <ul> <li>...</li> </ul> 有序列表 顺序至关重要的一组元素. <ol> < ...
- Bootstrap3 排版-引用
在你的文档中引用其他来源的内容. 默认样式的引用 将任何 HTML 元素包裹在 <blockquote> 中即可表现为引用样式.对于直接引用,我们建议用 <p> 标签. Lor ...
- Bootstrap3 排版-地址
让联系信息以最接近日常使用的格式呈现.在每行结尾添加 可以保留需要的样式. Twitter, Inc. 795 Folsom Ave, Suite 600 San Francisco, CA 9410 ...
- Bootstrap3 排版-缩略语
当鼠标悬停在缩写和缩写词上时就会显示完整内容,Bootstrap 实现了对 HTML 的 <abbr> 元素的增强样式.缩略语元素带有 title 属性,外观表现为带有较浅的虚线框,鼠标移 ...
- Bootstrap3 排版-改变大小写
通过这几个类可以改变文本的大小写. <p class="text-lowercase">Lowercased text.</p> <p class=& ...
- Bootstrap3 排版-对齐
通过文本对齐类,可以简单方便的将文字重新对齐. Left aligned text. Center aligned text. Right aligned text. Justified text. ...
随机推荐
- linux内核源码分析 - nvme设备的初始化
本文为原创,转载请注明:http://www.cnblogs.com/tolimit/ 本文基于3.18.3内核的分析,nvme设备为pcie接口的ssd,其驱动名称为nvme.ko,驱动代码在dri ...
- 关于python 使用腾讯云OCR 通用印刷体识别
腾讯的python SDK没有通用印刷体识别,所以参考了别人识别网上图片的方式:https://www.cnblogs.com/semishigure/p/7690789.html 但是咱们使用的基本 ...
- CentOS在线安装Mysql5.7
一.通过Yum命令安装 1.下载rpm安装源 官方地址:https://dev.mysql.com/downloads/repo/yum/ rpm文件地址:https://dev.mysql.com/ ...
- [LeetCode] Boundary of Binary Tree 二叉树的边界
Given a binary tree, return the values of its boundary in anti-clockwise direction starting from roo ...
- Unity3D UGUI 自动调节大小
可添加以下组件 组件包含的两个枚举参数,可以自行设定适应方式. 例如一个Text UI元素,当文字过多的时候他不会自动增加高度而导致文字不能完全显示,这时候就可以挂载这个组件,如上图设置参数,就可以自 ...
- 学习flexible.js
flexible是手淘团队总结的一套移动端适配方案,这篇文章是自己对flexible学习历程的记录,也算是一个备忘. https://github.com/amfe/article/issues/17 ...
- Linear Regression with Scikit Learn
Before you read This is a demo or practice about how to use Simple-Linear-Regression in scikit-lear ...
- [JSOI2015]非诚勿扰
Description [故事背景] JYY赶上了互联网创业的大潮,为非常勿扰开发了最新的手机App实现单身 大龄青年之间的“速配”.然而随着用户数量的增长,JYY发现现有速配的算法似 乎很难满足大家 ...
- [USACO12FEB]牛的IDCow IDs
题目描述 Being a secret computer geek, Farmer John labels all of his cows with binary numbers. However, ...
- 【20170920校内模拟赛】小Z爱学习
所有题目开启-O2优化,开大栈空间,评测机效率为4亿左右. T1 小 Z 学数学(math) Description 要说小 Z 最不擅长的学科,那一定就是数学了.这不,他最近正在学习加法运算.老 ...