O'Reilly logo

Bootstrap 4 – Responsive Web Design by Jason Marah, Benjamin Jakobus, Matt Lambert, Silvio Moreto

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Building our first Bootstrap example

Now we are all set for the framework. Replace the Hello World! line in the body tag with this:

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Hello World!</title>

    <link rel="stylesheet" href="css/bootstrap.css">

    <!--[if lt IE 9]>
      <script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js">
</script>
      <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js">
</script>
    <![endif]-->
  </head>
  <body>

    <div class="jumbotron">
      <h1>Hello, world!</h1>
      <p>This is our first sample example that will be more awesome in the next chapters!</p>
 <a class="btn btn-primary ...

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, interactive tutorials, and more.

Start Free Trial

No credit card required