码迷,mamicode.com
首页 > 其他好文 > 详细

bootstrap

时间:2017-06-27 20:49:15      阅读:126      评论:0      收藏:0      [点我收藏+]

标签:响应式   boot   ini   containe   init   大屏幕   container   hidden   meta   


   bootstarp
   前端框架
   响应式布局
   
   1.引入jquery的js文件
   2.引入boostrap的js文件
   3.引入bootstrap的css文件
   4.设置视口(支持移动设备优先)
    <meta name="viewport" content="width=device-width, initial-scale=1">
   5.创建一个容器
    div
    class
     container
     container-fluid

  css的媒体查询
   分辨率     屏幕大小
   fbl>1200px    大屏幕
   1200px>fbl>992px   中等屏幕
   992px>fbl>768px    小屏幕
   768px>fbl    超小屏幕

  栅格系统:
   一行被分成12份    如果超过12份另起一行
   分辨率     屏幕大小           样式
   fbl>1200px    大屏幕  col-lg-n
   1200px>fbl>992px   中等屏幕 col-md-n
   992px>fbl>768px    小屏幕  col-sm-n
   768px>fbl    超小屏幕 col-xs-n
   
   可以隐藏元素 div
    hidden-xs |sm|md |lg
    只会声明自己
  bootstrap的组成
   全局的css样式
   组件
   js插件

bootstrap

标签:响应式   boot   ini   containe   init   大屏幕   container   hidden   meta   

原文地址:http://www.cnblogs.com/outsidersblogs/p/7086937.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!