国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 開發 > CSS > 正文

CSS里的min-height和max-height怎么使用

2020-03-22 19:22:51
字體:
來源:轉載
供稿:網友
最大最小高度的樣式使用非常方便,滿足固定高度弊端.這篇文章就給大家介紹一下,CSS里如何使用min-height和max-height。

Css min-height應用地方解釋

我們有時設置一個對象盒子時候避免對象沒有內容時候不能撐開,但內容多少不能確定所以又不能固定高度,這個時候我們就會需要css來設置min-height最小高度撐高對象盒子。當內容少時候最小高度能將內容顯示出,如果內容多余最小高度能裝下時候,對象也會再隨內容增多而增高。

Css max-height最大高度應用解釋

此屬性很少使用,可能是為了避免內容太多將高度撐太高影響布局美化統一,這個時候我們設置最大高度限制。比如一個table tr td表格對象里裝一個圖片,而圖片高度不確定,如果太高了不想圖片撐破tr td表格,這個時候通過css max-height限制圖片最大高度是有必要的。

CSS最大最小高度目錄

語法與結構

最大最小高度用法案例

max-height min-height最大最小高度總結

擴展閱讀:

1、CSS隱藏超出溢出內容

2、隱藏html內容

3、css隱藏集合

4、css height

5、css min-width

6、css max-width

語法與結構

min-height和max-height的值為數字+html單位

Exp

min-height:50px 最小高度50pxmax-height:50px 最大高度50px

CSS用法結構

div{min-height:50px }div{max-height:50px }

最大最小高度用法案例

我們設置2個對象盒子一個最小高度(min-height:)與最大高度(max-height)限制,為了便于觀察應用案例效果,我們設置2個盒子CSS寬度相同和css border 邊框樣式。

1、對應css代碼

.div-min,.div-max{ width:300px; border:1px solid #F00} .div-min{ min-height:60px} .div-max{ max-height:60px; margin-top:10px}

2、案例html源代碼片段:

 div >


我們將兩個對象內容增多

Html代碼:

 div >

這里我們都將2個對象盒子里內容增加超出60px高度限制

小技巧,這里如果對css命名“.div-max”加入overflow:hidden樣式即可隱藏最大高度顯示溢出內容。

我們設置2個盒子一個限制最小高度,一個設置限制最大高度,最小高度限制的對象如果內容不多不會超出限制最小高度,此時對象會顯示最小高度限制值,如果內容比較多超過了最小高度限制能裝下單,此時對象會自動增高。而后者最大高度max-height限制,內容少時候不會有什么區別,但內容多時候,而最大高度限制也裝不下時候,內容會超出最大高度限制,但對象本身還是最大高度,這樣就出現內容溢出超出對象盒子,我們即可使用css overflow屬性隱藏溢出內容。

min-height和max-height的使用方法就這么多,更多精彩請關注php 其它相關文章!

相關閱讀:

HTML里空格字符怎么輸入

在HTML里p段落行高行距怎么設置

怎樣知道瀏覽器支不支持html5

以上就是CSS里的min-height和max-height怎么使用的詳細內容,html教程

鄭重聲明:本文版權歸原作者所有,轉載文章僅為傳播更多信息之目的,如作者信息標記有誤,請第一時間聯系我們修改或刪除,多謝。

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 南涧| 廉江市| 闸北区| 策勒县| 宝清县| 什邡市| 基隆市| 陵川县| 庆元县| 渭南市| 三台县| 武川县| 东乌珠穆沁旗| 阿巴嘎旗| 海淀区| 大港区| 荆州市| 武鸣县| 军事| 吴桥县| 奎屯市| 和林格尔县| 宜城市| 东乌珠穆沁旗| 兴国县| 淮北市| 天峨县| 合水县| 沧州市| 莱阳市| 秭归县| 平舆县| 大冶市| 广丰县| 宜阳县| 湟源县| 龙游县| 周口市| 安义县| 十堰市| 策勒县|