First of all, humorous, if you want to go straight to Bootstrap, please start from the second paragraph. Friday interview a small company, gave me a PSD diagram let me use the fastest time to help out this static page, the requirements are to ensure compatibility and the Web response to various screens normal display. Friday night began to do the early morning, and then Saturday sleep a day of sleep back, found that the current energy is really no more than college graduation. Sunday relaxed one day, the new version of the Lich King's knight just opened, must play a bit. Ti7newbee lost. China's new song this session really can't. China has hip-hop so far most like the talent of small Blue dragon (unfortunately sound general), hoping to bring more beautiful songs, Pgone should be the title of popular, the scene atmosphere was driven to explode! Seriously, the game is a real TM, but I don't know why I want to watch it.
Go to the Chase:
1, with Bootstrap first to the Chinese official website download package: http://v3.bootcss.com/, Version selection 3.3.7.
2, the new file to partition the file, the downloaded bootstrap package into the Lib file, lib file storage from the external introduction of the class library (such as jquery, Bootstrap)
3. Create index.html file and introduce bootstrap to HTML.
<!DOCTYPE HTML><HTMLLang= "ZH-CN"><Head> <MetaCharSet= "UTF-8"> <Metahttp-equiv= "X-ua-compatible"content= "Ie=edge"> <Metaname= "Viewport"content= "Width=device-width, initial-scale=1, User-scalable=no"> <title>Shenma</title> <Linkhref= "Lib/bootstrap/css/bootstrap.css"rel= "stylesheet"><!--Introducing Bootstrap style sheets - <!--conditional comments When the version is less than IE9 introduced - <!--[If Lt IE 9]> <script src= "lib/html5shiv/html5shiv.min.js" ></script> <script src= "Lib/res Pond/respond.min.js "></script> <! [EndIf] - <Linkrel= "stylesheet"href= "Css/main.css"></Head><Body> <!--Write it down here. - <!--after the DOM is loaded, execute the following script - <!--introduce jquery because Bootstrap relies on jquery2.0 or above, so you need to refer to it before Bootstrap - <Scriptsrc= "Lib/jquery/jquery.js"></Script> <!--introduction of Bootstrap - <Scriptsrc= "Lib/bootstrap/js/bootstrap.js"></Script> <!--Introduce yourself to JS - <Scriptsrc= "Js/main.js"></Script></Body></HTML>
4, can now use bootstrap writing code, first introduce the next container (commonly known as alleys) class for fixed width and center of the Responsive layout container. We can complete the responsive grille layout by wrapping the Row,row inside the container and nesting the col-lg-*/col-md-*/col-sm-*/col-xs-*. The number of columns (COL) displayed in the row is adjusted by the Media query detection screen width.
The next article should be treated as a bar chart for banner in the Web page.
Write a simple static web page with bootstrap