Documents

Bootstrap

Description
about bootstrap
Categories
Published
of 2
All materials on our website are shared by users. If you have any questions about copyright issues, please report us to resolve them. We are always happy to assist you.
Related Documents
Share
Transcript
  -adding the bootstrap framewor-include jquery because bootstrap needs it <link href= css/bootstrap.css rel= stylesheet ><script src= js/bootstrap.js ></script>-bootstraps container class wil responsi!ely add margins center wrap our content<di! class = container ></di!>-class = container-fluid allows for stretching if its desired.-bootstrap columns add up to #$ per rowadd row per each row<di! class = container ><di! class = row><di! class = col-md-#$ ></di!><di! class = row ><di! class = col-md-% ><di! class = col-md-% ><di! class = col-md-% ></di!></di!></di!>-empty columns using an offset.col-md-offset-& class is used to add left padding for a gi!en number of columns.<di! class = row><di! class = col-md-'></di!><di! class = col-md-( col-md-offset-#></di!>the abo!e adds a column of padding to the left of the sidebar )*' columns for content/#columns offset/(columns for the sidebar-md works for medium grid si+e ,,$p and higher.not for sm si+ed de!ice)'p-hiding elements using .hidden-&we can hide elements in specific screen si+es<di! class = col-md->sss</di!> <di! class=col-md- hidden-sm hidden-s)><img src= lll alt= ll /></di!>-making elements !isible using .!isible-&<di! class= col-md- !isible-md !isible-lg ><img///</di!>-using the .lead typography class we can make the tet stands out. <p class = lead>hi</p>-using <di! class = row tet-center to center the row.-glyphicon using <i class = glyphicon glyphicon-random></i>we can change the si+e or color in css file using.glyphicon0font-si+e1($p)2-no bullet point1 <li class= list-unstyled >-.well class gi!e the element a gray background and a rounded gray border<di! class = row well>you can add si+e<di! class = row well well-lg> adding padding to the well-style the button with<button type = button class=btn>styled</button>-adding si+e<button type = button class=btn btn-lg>-adding color  <button type = button class=btn btn-primary>-for na!igationremo!e grild we had <di! class =na!bar na!bar-default na!bar-static-top>//static top) na!bar will scroll with the page but with fied-top na!bars dont scroll with the page they stay at the top//using na!bar changes link colors in the header and adds padding<di! class=container>//because we!e put na!bar class outside container it will stretch<a href=/ class=na!bar-brand>our link will be directly net to our na!igation link</a><ul class= na! >//adds padding for all of the na!igation links its like a glphicon or btn -//.na! class with modifiers can be used for a main na!igation e*<ul class=na! na!bar-a! na!bar-right></ul//na!bar-na! makes them inline<ul class=na! na!-tabs></ul></ul></di!>
We Need Your Support
Thank you for visiting our website and your interest in our free products and services. We are nonprofit website to share and download documents. To the running of this website, we need your help to support us.

Thanks to everyone for your continued support.

No, Thanks