当前位置:首页 > BootStrap > 正文内容
五月22日

时间:2016-05-22 15:55

Bootstrap教程 巨幕(Jumbotron)

0
分类:BootStrap | 评论:0人 | 浏览:84次   

巨幕(Jumbotron)这是一个轻量、灵活的组件,它能延伸至整个浏览器视口来展示网站上的关键内容。以增加标题的大小,并为登陆页面内容添加更多的外边距(margin)。
巨幕创建步骤
    1. ■ 创建一个带有 class .jumbotron. 的容器

<div>

    1. ■ 除了更大的

<h1>

    ,字体粗细 font-weight 被减为 200px。
  1.  <div class="jumbotron">
  2.   <h1>Hello, world!</h1>
  3.   <p>这是一个超大屏幕(Jumbotron)的实例。</p>
  4.   <p><a class="btn btn-primary btn-lg" href="http://www.511yj.com/category/classification/bootstrap" role="button">Learn more</a></p>
  5. </div>
如果需要让巨幕组件的宽度与浏览器宽度一致并且没有圆角,请把此组件放在所有 .container 元素的外面,并在组件内部添加一个 .container 元素。这样适合做宽屏的logo.
  1.  <div class="jumbotron">
  2.   <div class="container">
  3.   <h1>Hello, world!</h1>
  4.   <p>这是一个超大屏幕(Jumbotron)的实例。</p>
  5.   <p><a class="btn btn-primary btn-lg" href="http://www.511yj.com/category/classification/bootstrap" role="button">Learn more</a></p>
  6.   </div>
  7. </div>

来源:Dashu.info(微信号/QQ号:43318553),转载请注明出处,谢谢!

  • 评论:(0)
  • 有图有真相

站内搜索

css.php

无觅相关文章插件,快速提升流量