Basic bootstrap layout and bootstrap Layout

Basic bootstrap layout and bootstrap Layout
Chinese APIbootstrap.cn HTML5 document type mobile devices give priority to the width attribute to control the width of the device. Set it to device-width to ensure that it is correctly displayed on different devices. Initial-scale = 1.0 make sure that the page is displayed in a ratio during loading without any scaling. In the mobile device browser, you can disable zooming by adding user-scalable = no to the viewport meta tag. Generally, maximum-scale = 1.0 is used with user-scalable = no. After the scaling function is disabled, you can only scroll the screen to make your website look more like a native application. <Meta name = "viewport" content = "width = device-width, user-scalable = no, initial-scale = 1.0"> layout container. the container class is used to fix the width and support responsive layout of containers <div class = "container"> </div>. the container-fluid class is used for containers that occupy the width of 100% and occupy all the views. <div class = "container-fluid"> </div> the grid system uses the row) the page layout row combined with column must be in the container. container or. In container-fluid. in the raster system, the column is represented by a value ranging from 1 to 12 (<768px ). col-xs-small column screen (> = 768px ). col-sm-column medium screen (> = 992px ). col-md-large column screen (> = pixel px ). col-lg-column <div class = "container main"> <div class = "row"> <! -- Two small screen columns. Medium screen four columns --> <div class = "col-md-3 col-sm-6"> col-md-3 col-sm-6 </div> <div class = "col-md-3 col-sm-6"> col-md-3 col-sm-6 </div> <div class =" col-md-3 col-sm-6> col-md-3 col-sm-6 col-md-3 </div> <div class = "col-sm-6 col-md-3"> col-sm-6 </div> column offset. col-md-offset-* class. These classes add * columns to the left margin (margin) of a column, where * ranges from 1 to 11. Column sorting. col-md-push-* And. col-md-pull-* display or hide. the show and hidden classes can force any element to show or hide the response type to hide or display the ultra-small screen (<768 ). visible-xs-* small screen (> = 768 ). visible-sm-* medium screen (> = 992 ). visible-md-* large screen (> = 1200 ). visible-lg -*. the visible-* class has three variants, each of which is for a different display in CSS. visible-*-block. visible-*-inline. visible-*-inline-block hides the ultra-small screen (<768 ). hidden-xs small screen (> = 768 ). hidden-sm medium screen (> = 992 ). hidden-md large screen (& gt; = 1200 ). hidden-lg quickly float any element to the left or right. pull-left and pull-right <div class = "pull-left"> </div> <div class = "pull-right"> </div> cannot be used in navigation bar components. use the navigation bar. navbar-left or. navbar-right <ul class = "nav navbar-left"> </ul> <ul class = "nav navbar-right"> </ul> center. center-block clear floating. clearfix