基于Bootstrap的页面排版知识
标题:
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的页面排版知识的更多相关文章
- 循序渐进BootstrapVue,开发公司门户网站(1)---基于Bootstrap网站模板构建组件界面
在前面随笔<使用BootstrapVue相关组件,构建Vue项目界面>概括性的介绍了BootstrapVue的使用过程,其实选用这个主要就是希望能够用来构建一些公司门户网站的内容,毕竟基于 ...
- 基于Bootstrap设计网页
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...
- [转载:Q1mi]Bootstrap和基于Bootstrap的登录验证示例
转载自:Q1mi Bootstrap介绍 Bootstrap是Twitter开源的基于HTML.CSS.JavaScript的前端框架. 它是为实现快速开发Web应用程序而设计的一套前端工具包. 它支 ...
- 基于BootStrap,FortAweSome,Ajax的学生管理系统
一. 基于BootStrap,FortAweSome,Ajax的学生管理系统代码部分 1.students.html <1>html页面文件 <!DOCTYPE html> & ...
- 基于bootstrap的漂亮网站后台管理界面框架汇总
基于bootstrap的漂亮网站后台管理界面框架汇总 10个最新的 Bootstrap 3 管理模板 这里分享的 10 个模板是从最新的 Bootstrap 3 管理模板集合中挑选出来的,可以帮助你用 ...
- [技术博客]采用Bootstrap框架进行排版布局
[技术博客]采用Bootstrap框架进行排版布局 网页的前端框架有很多很多种,比如Bootstrap.Vue.Angular等等,在最开始其实并没有考虑到框架这回事,开始阅读往届代码时发现其部分采用 ...
- JS组件系列——基于Bootstrap Ace模板的菜单和Tab页效果分享(你值得拥有)
前言:最近园子里多了许多谈语言.谈环境.谈逼格(格局)的文章,看看笑笑过后,殊不知其实都是然并卵.提升自己的技术才是王道.之前博主分享过多篇bootstrap组件的文章,引起了很多园友的关注和支持,看 ...
- 基于Bootstrap仿淘宝分页控件实现
.header { cursor: pointer } p { margin: 3px 6px } th { background: lightblue; width: 20% } table { t ...
- 基于BootStrap框架构建快速响应的GPS部标监控平台
最近一个客户要求将gps部标平台移植到bootStrap框架作为前端框架,符合交通部796部标只是他们的一个基本要求,重点是要和他们的冷链云物流平台进行适配.我自己先浏览了客户的云物流平台的界面,采用 ...
随机推荐
- Windows Server 笔记(七):Windows Server 2012 R2 NIC Teaming(NIC组)
什么是NIC Teaming? NIC Teaming 就是将两个或更多的网络适配器组合在一起,从而达到容错和带宽聚合作用.NIC Teaming 中的每个网络适配器都是物理存在的(虚 ...
- 从shell(终端)中退出python
从shell(终端)中退出python: 1.输入命令行:$ exit() 2.快捷键: ctrl+Z
- web项目中各种路径的获取(复制,为以后好找资源)
web项目中各种路径的获取 1.可以在servlet的init方法里 String path = getServletContext().getRealPath("/"); 这将获 ...
- php开启子进程处理
$pageNum = ceil($totalNum/$pageSize); for($page=1;$page<=$pageNum;$page++){ $this->o_pcntl-> ...
- 使用CoreLocation进行定位(Swift版)
在应用开发中,很多情况需要我们获取到当前的位置和高度信息,方便搜索周边,查看周边相同应用等,一切与定位有关的都得使用CoreLocation库,而且,系统是不允许第三发定位的,当然可以使用第三方对其封 ...
- 简单Dp----最长公共子序列,DAG最长路,简单区间DP等
/* uva 111 * 题意: * 顺序有变化的最长公共子序列: * 模板: */ #include<iostream> #include<cstdio> #include& ...
- eclipse中 tomcat首页server Locations变灰无法编辑
解决办法: 1.首先将Servers中部署的工程全部清空 2.然后对Tomcat v8.0 Server at localhost,点右键进行clean处理,再重新双击打开server服务即可.
- python网络
try: import urllib.request as urllib2 except ImportError: import urllib2 response = urllib2.urlopen( ...
- C++ qsort() 函数调用时实参与形参不兼容的问题解决
<剑指OFFER>刷题笔记 —— 扑克牌顺子 LL今天心情特别好,因为他去买了一副扑克牌,发现里面居然有2个大王,2个小王(一副牌原本是54张^_^)...他随机从中抽出了5张牌,想测测自 ...
- Idea下maven的配置和使用
maven的主要功能就是依赖管理,jar包仓库.和C#中的NuGet仓库差不多.另外也提供打包构建,启动插件等功能.下面主要讲一下,在使用Idea开发时,maven的配置和使用. maven的安装和配 ...