美文网首页
Bootstrap组件 - 超大屏幕、页头

Bootstrap组件 - 超大屏幕、页头

作者: 蝴蝶结199007 | 来源:发表于2017-06-15 18:07 被阅读18次

    超大屏幕
    .jumbotron,这是一个轻量、灵活的组件,它能延伸至整个浏览器视口来展示网站上的关键内容。

    <div class="jumbotron">
      <h1>Hello, world!</h1>
      <p>...</p>
      <p><a class="btn btn-primary btn-lg" href="#" role="button">Learn more</a></p>
    </div>
    

    如果需要让巨幕组件的宽度与浏览器宽度一致并且没有圆角,请把此组件放在所有 .container 元素的外面,并在组件内部添加一个 .container 元素。

    <div class="jumbotron">
      <div class="container">
        ...
      </div>
    </div>
    

    页头
    .page-header,页头组件能够为 h1 标签增加适当的空间,并且与页面的其他部分形成一定的分隔。它支持 h1 标签内内嵌 small 元素的默认效果,还支持大部分其他组件(需要增加一些额外的样式)。

    <div class="page-header">
      <h1>Example page header <small>Subtext for header</small></h1>
    </div>
    

    相关文章

      网友评论

          本文标题:Bootstrap组件 - 超大屏幕、页头

          本文链接:https://www.haomeiwen.com/subject/qteuqxtx.html