Bootstrap 超大屏幕(Jumbotron)

Bootstrap3 教程 · 2019-03-01 15:42:44

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

  • 创建一个带有 class .jumbotron. 的容器 <div>。
  • 除了更大的 <h1>,字体粗细 font-weight 被减为 200。

下面的实例演示了这点:

实例

<div class="container"> <div class="jumbotron"> <h1>欢迎登陆页面!</h1> <p>这是一个超大屏幕(Jumbotron)的实例。</p> <p><a class="btn btn-primary btn-lg" role="button"> 学习更多</a> </p> </div> </div>

结果如下所示:

超大屏幕(Jumbotron)

为了获得占用全部宽度且不带圆角的超大屏幕,请在所有的 .container class 外使用 .jumbotron class,如下面的实例所示:

实例

<div class="jumbotron"> <div class="container"> <h1>欢迎登陆页面!</h1> <p>这是一个超大屏幕(Jumbotron)的实例。</p> <p><a class="btn btn-primary btn-lg" role="button"> 学习更多</a> </p> </div> </div>

结果如下所示:

全宽的超大屏幕(Jumbotron)

点击查看所有 Bootstrap3 教程 文章: https://codercto.com/courses/l/25.html

查看所有标签

C程序设计

C程序设计

谭浩强 / 清华大学出版社 / 2005-7-1 / 26.00元

《C程序设计(第3版)》作者具有丰富的教学经验和编写教材的经验,并针对初学者的特点,精心策划、准确定位,使得《C程序设计(第3版)》概念清晰、例题丰富、深入浅出,受到专家和读者的一致好评。《C程序设计(第3版)》被普遍认为是学习C语言的好教材,并被全国大多数高校选用。十多年来《C程序设计(第3版)》累计发行了800多万册,刨同类书的全国最高记录,是学习C语言的主流用书。《C程序设计(第3版)》曾荣......一起来看看 《C程序设计》 这本书的介绍吧!

图片转BASE64编码
图片转BASE64编码

在线图片转Base64编码工具

SHA 加密
SHA 加密

SHA 加密工具

XML、JSON 在线转换
XML、JSON 在线转换

在线XML、JSON转换工具