Bootstrap页面标题(PageHeader)是个不错功能,它会网页的标题的四周添加适当的间距,当一个网页中有多个标题并且每个标题之间需要添加一定适当的间距,使用页面标题是非常有用的。如果需要使用页面标题,你把标题放到一个class.pageheader类的div中。

实例:

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width,initial-scale=1.0" />
<link rel="stylesheet" href="bootstrap-3.3.5-dist/css/bootstrap.min.css"/>
</head>
<body>
<div class="container">
<div class="page-header">
<h2>页面标题实例<small>子标题实例</small></h2>
</div>
<p>这是一个示例文本。这是一个示例文本。这是一个示例文本。这是一个示例文本。这是一个示例文本。</p>
</div>
<script src="jQuery/jquery-2.1.4.js"></script>
<script src="bootstrap-3.3.5-dist/js/bootstrap.min.js"></script>
</body>
</html>

Bootstrap 页面标题(Page Header)的更多相关文章

  1. Bootstrap <基础二十三>页面标题(Page Header)

    页面标题(Page Header)是个不错的功能,它会在网页标题四周添加适当的间距.当一个网页中有多个标题且每个标题之间需要添加一定的间距时,页面标题这个功能就显得特别有用.如需使用页面标题(Page ...

  2. Bootstrap <基础二十九>面板(Panels)

    Bootstrap 面板(Panels).面板组件用于把 DOM 组件插入到一个盒子中.创建一个基本的面板,只需要向 <div> 元素添加 class .panel 和 class .pa ...

  3. Bootstrap <基础二十八>列表组

    列表组.列表组件用于以列表形式呈现复杂的和自定义的内容.创建一个基本的列表组的步骤如下: 向元素 <ul> 添加 class .list-group. 向 <li> 添加 cl ...

  4. Bootstrap<基础二十七> 多媒体对象(Media Object)

    Bootstrap 中的多媒体对象(Media Object).这些抽象的对象样式用于创建各种类型的组件(比如:博客评论),我们可以在组件中使用图文混排,图像可以左对齐或者右对齐.媒体对象可以用更少的 ...

  5. Bootstrap <基础二十六>进度条

    Bootstrap 进度条.在本教程中,你将看到如何使用 Bootstrap 创建加载.重定向或动作状态的进度条. Bootstrap 进度条使用 CSS3 过渡和动画来获得该效果.Internet ...

  6. Bootstrap <基础二十五>警告(Alerts)

    警告(Alerts)以及 Bootstrap 所提供的用于警告的 class.警告(Alerts)向用户提供了一种定义消息样式的方式.它们为典型的用户操作提供了上下文信息反馈. 您可以为警告框添加一个 ...

  7. Bootstrap<基础二十四> 缩略图

    Bootstrap 缩略图.大多数站点都需要在网格中布局图像.视频.文本等.Bootstrap 通过缩略图为此提供了一种简便的方式.使用 Bootstrap 创建缩略图的步骤如下: 在图像周围添加带有 ...

  8. Bootstrap <基础二十二>超大屏幕(Jumbotron)

    Bootstrap 支持的另一个特性,超大屏幕(Jumbotron).顾名思义该组件可以增加标题的大小,并为登陆页面内容添加更多的外边距(margin).使用超大屏幕(Jumbotron)的步骤如下: ...

  9. Bootstrap <基础二十一>徽章(Badges)

    Bootstrap 徽章(Badges).徽章与标签相似,主要的区别在于徽章的边角更加圆滑. 徽章(Badges)主要用于突出显示新的或未读的项.如需使用徽章,只需要把 <span class= ...

随机推荐

  1. ue4 碰撞检测测试

    记录几条物理相关 测试条件,1使用setActorLocation移动,3使用控制器的移动 1 moveCube  2 targetCube  3 Character 两个Cube的碰撞事件 1和2的 ...

  2. cogs1583. [POJ3237]树的维护

    1583. [POJ3237]树的维护 http://www.cogs.pro/cogs/problem/problem.php?pid=1583 ★★★☆   输入文件:maintaintree.i ...

  3. 笔记-JavaWeb学习之旅17

    1.过滤选择器 首元素选择器:first 获得选择的元素中的第一个元素 尾元素选择器:last获得选择元素中的最后一个元素 非元素选择器:not(selector) 不包括指定内容的元素 偶数选择器: ...

  4. 用SqlDataAdapter与datagridview配合实现快速CRUD

    private void btnSave_Click(object sender, EventArgs e) { //把DataGridView的修改的数据保存到数据库中去. string connS ...

  5. linux 初始配置(centos)-网络和可视化界面

    1. 执行命令查看ip:ip addr 2. 如果没有或取到,要查看网卡是否启动,及ip配置是否正确,请先将ONBOOT改成yes,表示开机即启动 [lobin@localhost ~]$ cat / ...

  6. nginx超时问题

    一. 戏说不管你是做运维还是做开发,哪怕你是游客,时不时会遇到502 Bad Gateway或504 Gateway Time-out.出现这页面,把服务重启下,再实在不行重启下服务器,问题就解决了, ...

  7. opencv 形态学膨胀和腐蚀以及开运算和闭运算

  8. Java 2 个 List 集合数据求并、补集操作

    开发过程中,我们可能需要对 2 个 或多个 List 集合中的数据进行处理,比如多个 List 集合数据求 相同元素,多个 List 集合数据得到只属于本身的数据,如图示: 这里写图片描述 这里以 2 ...

  9. Array.isArray() 和 isObject() 原生js实现

    function isObject(val) { return val != null && typeof val === 'object' && Array.isAr ...

  10. 第二十章 排查和调试Web程序 之 设计异常处理策略

    1. 概述 本章内容包括: 多层架构中的异常处理.使用global.asax 或 自定义的HttpHandler 或 web.config中的属性来显示特定的错误页.处理 first chance 异 ...