标题:


Bootstrap定义了所有HTML的标题样式,<h1>...<h6>标签或者在标签内加入.h1 class等可以得到一样的效果

效果:

副标题:

标签<small>或者添加.small class

效果:

缩写:

<abbr>标签,title属性中写全称

<abbr title="World Trade Organization">WTO</abbr>

当鼠标移动到文本上时显示:

列表:

.list-unstyled class的应用(去除列表前面的样式)

效果:

.list-inline class(列表会显示在一行上)

效果:

.dl-horizontal class应用于定义列表

效果:

更多的类

.lead 突出显示

.text-left 文本左对齐

.text-center 文本居中对齐

.text-right 文本右对齐

.tetx-nowrap 文本段落不换行

.text-justify 自动换行

.text-uppercase 文本大写

.text-lowercase 文本小写

.text-capitalize 首字母大写

基于Bootstrap的页面排版知识的更多相关文章

  1. 循序渐进BootstrapVue,开发公司门户网站(1)---基于Bootstrap网站模板构建组件界面

    在前面随笔<使用BootstrapVue相关组件,构建Vue项目界面>概括性的介绍了BootstrapVue的使用过程,其实选用这个主要就是希望能够用来构建一些公司门户网站的内容,毕竟基于 ...

  2. 基于Bootstrap设计网页

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...

  3. [转载:Q1mi]Bootstrap和基于Bootstrap的登录验证示例

    转载自:Q1mi Bootstrap介绍 Bootstrap是Twitter开源的基于HTML.CSS.JavaScript的前端框架. 它是为实现快速开发Web应用程序而设计的一套前端工具包. 它支 ...

  4. 基于BootStrap,FortAweSome,Ajax的学生管理系统

    一. 基于BootStrap,FortAweSome,Ajax的学生管理系统代码部分 1.students.html <1>html页面文件 <!DOCTYPE html> & ...

  5. 基于bootstrap的漂亮网站后台管理界面框架汇总

    基于bootstrap的漂亮网站后台管理界面框架汇总 10个最新的 Bootstrap 3 管理模板 这里分享的 10 个模板是从最新的 Bootstrap 3 管理模板集合中挑选出来的,可以帮助你用 ...

  6. [技术博客]采用Bootstrap框架进行排版布局

    [技术博客]采用Bootstrap框架进行排版布局 网页的前端框架有很多很多种,比如Bootstrap.Vue.Angular等等,在最开始其实并没有考虑到框架这回事,开始阅读往届代码时发现其部分采用 ...

  7. JS组件系列——基于Bootstrap Ace模板的菜单和Tab页效果分享(你值得拥有)

    前言:最近园子里多了许多谈语言.谈环境.谈逼格(格局)的文章,看看笑笑过后,殊不知其实都是然并卵.提升自己的技术才是王道.之前博主分享过多篇bootstrap组件的文章,引起了很多园友的关注和支持,看 ...

  8. 基于Bootstrap仿淘宝分页控件实现

    .header { cursor: pointer } p { margin: 3px 6px } th { background: lightblue; width: 20% } table { t ...

  9. 基于BootStrap框架构建快速响应的GPS部标监控平台

    最近一个客户要求将gps部标平台移植到bootStrap框架作为前端框架,符合交通部796部标只是他们的一个基本要求,重点是要和他们的冷链云物流平台进行适配.我自己先浏览了客户的云物流平台的界面,采用 ...

随机推荐

  1. 基础_String

    String str1="hello"; String str2="hello"; String str3="hello"; String ...

  2. wim

    wim 编辑 WIM是英文Microsoft Windows Imaging Format(WIM)的简称,它是Windows基于文件的映像格式.WIM 映像格式并非现在相当常见的基于扇区的映像格式, ...

  3. leetcode 【 Remove Element 】python 实现

    题目: Given an array and a value, remove all instances of that value in place and return the new lengt ...

  4. Python基础-week01 Python安装/变量/输入/及循环语句使用

      一.Python介绍 (1).目前Python主要应用领域: 云计算: 云计算最火的语言, 典型应用OpenStack WEB开发: 众多优秀的WEB框架,众多大型网站均为Python开发,You ...

  5. git放弃修改&放弃增加文件

    1. 本地修改了一堆文件(并没有使用git add到暂存区),想放弃修改. 单个文件/文件夹: git checkout -- filename 所有文件/文件夹: git checkout . 2. ...

  6. 聊聊、CA机构认证CSR生成

    https://search.thawte.com/support/ssl-digital-certificates/index?page=content&id=SO832 https://s ...

  7. Java之implements

    转自:https://blog.csdn.net/android_lover2014/article/details/52176814 JAVA中extends 与implements有啥区别?1. ...

  8. unity中的main方法

    由于方法命名的原因,无意之间把一个方法命名为了Main,然后把这个方放到了Start方法中去执行,结果运行后发现这个方法竟然执行了两次 情况如下图: -------------- 检查代码,发现脚本并 ...

  9. Juice Junctions

    Juice Junctions 题目描述 你被雇佣升级一个旧果汁加工厂的橙汁运输系统.系统有管道和节点构成.每条管道都是双向的,且每条管道的流量都是11升每秒.管道可能连接节点,每个节点最多可以连接3 ...

  10. ip地址正则表达式

    p = re.compile('^((25[0-5]|2[0-4]\d|[01]?\d\d?)\.){3}(25[0-5]|2[0-4]\d|[01]?\d\d?)$') if p.match(dom ...