When you want to create a HTML template, you have to write lot’s of code in CSS & JavaScript. Sometimes you want to compress your code, so that you can work very fast. There are many CSS framework. But Bootstrap is the most powerful CSS framework what I ever seen. In this article, I will show you how to use Bootstrap on your HTML template. You can create any type of block, elements with responsiveness.
Download necessary files.
If you want to use Bootstrap for your HTML template, you have to download the necessary file for your template. You can search in google for find Bootstrap files. On the other hand, you can download necessary from here.
You will be find find a zip file once you have downloaded. Now extract the zip file which you have downloaded. You will be find a folder. Go to inside the folder. Now will see some folder with some file.
Go to the “dist” folder and now you can see two folder which name is “css” and “js”. You need to copy two file from two folder. From css folder you can copy bootstrap.min.css. On the same way, you can copy bootstrap.min.js from js folder. You can put those file in your desired folder.
Now, link copied CSS and JavaScript files with your HTML template file. You can check following example:
<link href="yourfolder/bootstrap.min.css" rel="stylesheet" media="all" />By same way link copied anothe file. See following example code.
<script src="yourfolder/bootstrap.min.js"></script>Now, you are ready to start coding. You can use default CSS class for your desired style. If you want to override some default classes, you need to link another CSS file as your desired name. Many people use style.css for there own stylesheet. But note that, you have put your custom CSS file under the Bootstrap file. Otherwise, it’s may not work properly.
You have to also need to create a custom Javascript file for your template. So that you can execute default functions.
I hope you can understand how to use Bootstrap on your HTML template.
