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. Solr 6.7学习笔记(04)-- Suggest

    当我们使用baidu或者Google时,你输入很少的字符,就会自动跳出来一些建议选项,在Solr里,我们称之为Suggest,在solrconfig.xml里做一些简单的配置,即可实现这一功能.配置如 ...

  2. luogu P5358 [SDOI2019]快速查询【模拟(?)】

    把有单点修改和查询的点离散进一个数组,然后单点修改直接改,记录一个修改时间t,维护一个sm表示这些离散的点的和,val表示出了离散点其他点的值,因为都是一样的所以只记录这一个值即可,记录ljlc为加法 ...

  3. Selenium IDE + Firefox

    又掉进了同一个坑了,最新firefox版本和selenium ide不兼容,工具栏愣是找不到selenium ide的button,换成firefox5.0就好了  selenium用的版本是2.5. ...

  4. Spring Boot Dubbo 构建分布式服务

    概述: 节点角色说明 节点 角色说明 Provider 暴露服务的服务提供方 Consumer 调用远程服务的服务消费方 Registry 服务注册与发现的注册中心 Monitor 统计服务的调用次数 ...

  5. 总结 Sublime Text 3 无法安装 Package Control 插件的解决办法

    Sublime Text 是一款非常好用的轻便的编辑器,可以安装很多插件,实现IDE的很多功能,着实是程序员的利器. 我安装的 Sublime Text 3 Build 3143 ,软件汉化,软件激活 ...

  6. mCustomScrollbar 滚动条的使用

    前两天需要设置滚动条的样式,一开始我以为只是用css设置就可以了,嗯,果然还是想的很简单,虽然可以在css设置滚动条样式,但是只是在火狐,IE浏览器上根本就不能用,所以只能使用js插件来设置滚动条的属 ...

  7. selenium IDE插件下载

    1.在https://addons.mozilla.org/en-US/firefox/addon/selenium-ide/中下载Firefox的selenium-ide插件: 2.之后在Firef ...

  8. JS动态append之后点击事件无效

    今天做项目用了append向HTML里面添加结构代码,代码添加之后,单击事件就没反应了.搞得我一脸懵逼,调了代码很久实在不行,我百度了一下才发现,append添加的节点单击事件是不会生效的. 原因: ...

  9. react-native-syan-image-picker的使用

    传送门 第一种方式:link 第一步:安装 1.  npm install react-native-syan-image-picker --save 2.  react-native link re ...

  10. BZOJ3622(容斥+dp)

    思路 "恰k个"考虑求至少k.k+1--个容斥 题面说所有数字都不同,可以将所求转化为糖比药多的组数恰为\((n+k)/2\)的方案数 \(f[i][j]\)数组我觉得更好的理解方 ...