[Bootstrap] 1. container & container-fluid

时间：2020-12-23 18:47:13

Container: 居中

<!DOCTYPE html>

<html>

  <head>

    <title>Blasting Off With Bootstrap</title>

    <link href='css/bootstrap.min.css' rel='stylesheet'>

    <link href='css/main.css' rel='stylesheet'>

  </head>

  <body>

    <div class='container'>

      <h1>The Fastest Way to Space</h1>

      <p>Make your way to space in the comfort of your own rocket, elevator or transporter.</p>

      <button type='button'>Take the Tour</button>

      <button type='button'>Book Tickets Now</button>

    </div>

    <div class="footer"><div class="container"><p >This is our footer</p></div></div>

  </body>

</html>

[Bootstrap] 1. container & container-fluid

Container-fluid: 拉伸

<!DOCTYPE html>

<html>

  <head>

    <title>Blasting Off With Bootstrap</title>

    <link href='css/bootstrap.min.css' rel='stylesheet'>

    <link href='css/main.css' rel='stylesheet'>

  </head>

  <body>

    <div class='container'>

      <h1>The Fastest Way to Space</h1>

      <p>Make your way to space in the comfort of your own rocket, elevator or transporter.</p>

      <button type='button'>Take the Tour</button>

      <button type='button'>Book Tickets Now</button>

    </div>

    <div class="footer"><div class="container-fluid"><p >This is our footer</p></div></div>

  </body>

</html>

[Bootstrap] 1. container & container-fluid

相关文章