1 Star2 Stars3 Stars4 Stars5 Stars (6 votes, average: 5.00 out of 5)

Beginners Guide To Using Bootstrap Web Development

Beginners-Guide-To-Using-Bootstrap-Web-Development

Here is a beginners guide to using Bootstrap Web Development. Bootstrap is a library of code that you can use to create web pages. In this tutorial we will start with the basics of Bootstrap and advance from there.

Benefits of Using Bootstrap *

The benefits of using bootstrap is taking advantage of pre coded commands. Bootstrap uses HTML tag to target interaction.

The HTML Layout For Bootstrap *

If you have not already done so get familiar with HTML and how it works. This will give you the basic knowledge to using Bootstrap.

Viewport Tag for Bootstrap *

Notice that after we declare the HTML format that we use a viewport tag. A viewport tag is for mobile devices so that your web page will be mobile friendly.

 <meta name="viewport" content="width=device-width, initial-scale=1">

Head tag for Bootstrap Libraries *

The first thing that you have to do in your bare bones HTML is call in the Bootstrap library. Here is an example of that.

<!DOCTYPE html>
<html lang="en">
<head>
  <title>A Bootstrap Example Page</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
 <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
</head>
<body>

<div class="container">
  <h1>Bootstrap Heading</h1>
  <p>This is some text.</p> 
</div>

</body>
</html>

Try It Yourself *

See the bootstrap code and edit it here.

Div Classes in Bootstrap *

It matters what you name your div tags in the HTML for Bootstrap to work. In the example above we gave our opening div tag a class called “container”.

Using Bootstrap is easy once you get the hang of naming divs according to the Bootstrap library.

Please follow and like us:
Beginners Guide To Using Bootstrap Web Development was last modified: November 30th, 2016 by Maximus Mccullough

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.