為了測試CSS尺寸相關(guān)的屬性,我們需要一個(gè)包含了一個(gè)段落的div,點(diǎn)擊下面的按鈕將div圈出來(lái)。
設置CSS的height屬性,可以控制元素的高度。下面我們就試著(zhù)設置測試div的高度。
height: px
設置CSS的width屬性,可以控制元素的寬度。下面我們就試著(zhù)設置測試div的寬度。
width: px
為了測試溢出屬性,我們先來(lái)設置div的寬度150像素,高度為100像素。
width:150px;
height:100px;
可以看到,有一部分文字“溢出”到了div的外部。但是它們仍然是顯示出來(lái)的,可以通過(guò)設置CSS的overflow屬性來(lái)控制這些溢出內容的顯示。
overflow:hidden;
設置為hidden之后,溢出的內容就會(huì )隱藏起來(lái)。
overflow:scroll;
設置為scroll后,div周?chē)鷷?huì )出現滾動(dòng)條,可以通過(guò)滾動(dòng)來(lái)顯示溢出的內容。
overflow:visible;
設置為visible則表示仍然顯示溢出內容。
overflow:auto;
設置為auto屬性值表示根據是否有溢出內容來(lái)決定是否顯示滾動(dòng)條。
聯(lián)系客服