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.