News


Skype Contact



Blogger

JavaScript Function .prototype

Download: Fast, Fun, Awesome


 

Updated 15 May 13

Through this post I will give you quick overview for using Twitter bootstrap in your web project.

Twitter bootstrap is a framework that contain grid system and some JavaScript based  plugin feature. You can  quickly write better UI using Twitter bootstrap.

For get started on This post you need to download the Bootstrap from http://twitter.github.com/bootstrap Now copied all these folder in your root folder of your project. use these scripts and styles by link them in your html pages (mockup).

I personally prefer using LESS file for bootstrap. Bootstrap project on Github also use LESS for their project. For compile the LESS file you need  to have things like SimpLESS If you are using Visual Studio or webmatrix there are few plugin exist to automatically compile LESS file for you.

If you are using LESS file then you also able to track your error code easily. For example Simpless show error this way.

simpless

 

See this example code for how I link my files

<link rel="stylesheet" href="assets/normalize.css">
<link rel="stylesheet" href="assets/css/bootstrap.min.css"/>
<link rel="stylesheet" href="assets/css/bootstrap-responsive.min.css"/>
<link rel="stylesheet" href="assets/style.css"/>

Note that Normalize.css is not come with bootstrap. You need to get it separately from Github

The JavaScript features of Twitter bootstrap also required jQuery

<script src="assets/jquery-1.8.3.js"></script>
<script type="text/javascript" src="assets/script.js"> </script>

Now do What Laughing out loud

Now start looking at http://twitter.github.com/bootstrap/getting-started.html There is a lot of sites on internet who help you to get started with it. If you found any issue Just use Stackoverflow ,google or pots bugs/issues on Github.

Thanks for read my post. any suggestion Comments here for let me know Smile