zoukankan      html  css  js  c++  java
  • bootstrap 的媒体查询

      有时候需要对bootstap的样式自定义,比如说某个元素的“height”值,要放在与bootstrap媒体查询同步的样式里,才会兼容响应式布局。

    .container类是bootstrap的官方参考样式,照着官方设置的样式去自定义样式,就对了,一个样式要写三份。
    @media screen and (min- 992px){
         .container {
              max-width: 960px;
          }
       .自定义类{height: 800px} } @media screen and (min- 768px) and (max- 991px){ .container { max-width: 720px; } .自定义类{height: 600px}
    @media screen and (min- 576px) and (max- 767px){
        .container {
            max-width: 540px;
        }
    .自定义类{height: 200px}
    @media screen and (min- 992px){
        /*PC端*/
    }
    
    @media screen and (min- 768px) and (max- 991px){
        /*iPad端*/
    }
    
    @media screen and (min- 300px) and (max- 767px){
        /*手机端*/
    }
  • 相关阅读:
    static关键字详解
    解读equals()和hashCode()
    基于马士兵老师的高并发笔记
    scrapy安装及基本使用
    scrapy 简单操作
    python django简单操作
    Map,Filter 和 Reduce
    2017-08-06笔记
    幂等性
    Jmeter jdbc连接
  • 原文地址:https://www.cnblogs.com/qingsong/p/10201775.html
Copyright © 2011-2022 走看看