Setting up our project

Now that we know what Bootstrap has to offer, let us set up our project:

  1. Create a new project directory named MyPhoto. This will become our project root directory.
  2. Create a blank index.html file and insert the following HTML code:
            <!DOCTYPE html> 
        <html lang="en"> 
        <head> 
            <meta charset="utf-8"> 
            <meta name="viewport" content="width=device-width,
            initial-scale=1, shrink-to-fit=no"> 
            <meta http-equiv="x-ua-compatible" content="ie=edge"> 
            <title>MyPhoto</title> 
        </head> 
        <body> 
            <div class="alert alert-success"> 
                Hello World! 
            </div> 
        </body> 
        </html>

    Note the three meta tags. The first tag tells the browser that the document in question is utf-8 encoded. Since Bootstrap optimizes its content for mobile devices, ...

Get Bootstrap 4 – Responsive Web Design now with O’Reilly online learning.

O’Reilly members experience live online training, plus books, videos, and digital content from 200+ publishers.

Start your free trial