zoukankan      html  css  js  c++  java
  • max-height、min-height、height优先级的问题

    <style>
          #app{
                height:1000px;
                min-height:500px;
                max-height:300px;
            }
    </style>
    <body>
        <div id="app">
    
        </div>
    </body>
    
    
    问div的高度为多少

    经过实践得到高度为min-height即500px。

    总结

    当height和max-height同时存在,取较小值,即:
    max-height < height ------ 高度为max-height
    max-height > height ------ 高度为height
    当height和min-height同时存在,取较大值,即: min-height
    < height ------高度为height min-height > height ------ 高度为min-height
    当height和min-height和max-height同时存在,则: height > max-height > min-height ------高度为max-height height > min-height > max-height ------高度为min-height min-height > height > max-height ------高度为min-height

    哪怕设置了!important,结果也不会变化,仍然会被覆盖

    参考

    https://www.jianshu.com/p/f93f74a5fb22

    https://www.cnblogs.com/kunmomo/p/10600286.html

  • 相关阅读:
    map侧连接
    二次排序
    倒排索引
    多表关联
    单表关联
    Shuffle
    Partitioner
    Combiner
    CSS3中的多列
    CSS3动画
  • 原文地址:https://www.cnblogs.com/-roc/p/14621569.html
Copyright © 2011-2022 走看看