位置：首頁 > 軟件操作教程 > 編程開發(fā) > CSS > 問題詳情

CSS 內(nèi)容溢出與隱藏

提問人：劉團(tuán)圓發(fā)布時(shí)間：2020-11-18

    overflow屬性規(guī)定當(dāng)內(nèi)容溢出元素框時(shí)發(fā)生的事情。這個(gè)屬性定義溢出元素內(nèi)容區(qū)的內(nèi)容會(huì)如何處理。如果值為scroll,不論是否需要，用戶代理都會(huì)提供一種滾動(dòng)機(jī)制。因此：即使元素框中可以放 下所有內(nèi)容，也有可能會(huì)出現(xiàn)滾動(dòng)條。 overflow屬性的值可以是以下幾種。

    ?visible：默認(rèn)值，內(nèi)容不會(huì)被修剪，會(huì)呈現(xiàn)在元素框之外。

    ?hidden：內(nèi)容會(huì)被修剪，并旦其余內(nèi)容是不可見的。

    ?scroll：內(nèi)容會(huì)被修剪，但是瀏覽器會(huì)顯示滾動(dòng)條以便查看其余的內(nèi)容。

    ?auto：如果內(nèi)容被修剪，則瀏覽器會(huì)顯示滾動(dòng)條以便査看其余的內(nèi)容。

    ?inherit：規(guī)定應(yīng)該從父元素繼承overflow屬性的值。

    先看一下正常情況下當(dāng)元素溢出容器之后會(huì)發(fā)生什么。

    【例題】元素溢出容器

    代碼如下：

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Document</title>

<style>

div{

width: 300px;

height: 300px;

border:2px red solid;

}

</style>

</head>

<body>

<div>

<img src="img/0.1.jpg" alt="" width="400">

</div>

</body>

</html>

image.png


繼續(xù)查找其他問題的答案？

相關(guān)視頻回答
回復(fù)(0)
返回頂部