元素的高度自適應

來源:互聯網
上載者:User

元素的高度自適應

網頁布局中有時候有的高度需要根據內容調整,所以不能固定,今天就來說說,最小高度自適應

屬性:min-height 最小高度,但IE6不識別該屬性,height在IE6中類似min-height屬性;

以下是解決BUG問題方法:

hack1:min-height:value; _height:value;(IE6能識別底線"_"和星號" * ",IE7能識別星號" * ",但不能識別底線"_",而firefox兩個都不能認識)

hack2:min-height:value; _height:auto !important; height:value;(建議使用)

min-height 最小高度

max-height 最大高度

min-width最小寬度

max-width 最大寬度

浮動元素的高度自適應

如果父元素未設定高度和寬度且它裡麵包含了浮動元素,那麼它的高度就會出現塌陷問題,解決高度塌陷的問題很簡單,可以浮動父級元素、清除法等等,均可實現

hack1:給父元素添加浮動屬性:float;

hack2:給父元素添加屬性:overflow:hidden;

hack3:在浮動元素下方添加一個空的div,並給此元素添加屬性:clear:both;height:0;overflow:hidden;

hack3:給父元素添加此聲明(推薦使用)

父元素:after{content:"."; height:0; display:block; overflow:hidden; clear:both; visibility:hidden;}

  • 相關文章

    A Free Trial That Lets You Build Big!

    Start building with 50+ products and up to 12 months usage for Elastic Compute Service

    • Sales Support

      1 on 1 presale consultation

    • After-Sales Support

      24/7 Technical Support 6 Free Tickets per Quarter Faster Response

    • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.