CSS中的超出部分顯示問題 在網(wǎng)頁設(shè)計中，如何讓元素在達(dá)到一定尺寸時自動隱藏其超出部分，并且在鼠標(biāo)懸停時能夠顯示出來呢？這就需要用到CSS的overflow屬性和:hover偽類。 overflow屬性控制元素的溢出部分是否顯示，有以下三個屬性值： 1. visible（默認(rèn)）：溢出部分會顯示在元素外面。 2. hidden：溢出部分會被隱藏。 3. scroll：添加滾動條，可滾動查看溢出部分。 假設(shè)我們要讓一個div元素隱藏溢出部分，可以在樣式表中添加以下內(nèi)容：

div{
width: 200px;
height: 100px;
overflow: hidden;
}

這樣，如果div中的內(nèi)容超出了200×100的尺寸，就會被隱藏。 但是如果我們想要在鼠標(biāo)懸停時顯示出溢出部分，就需要用到:hover偽類。這個偽類表示鼠標(biāo)懸停在元素上時被選中的狀態(tài)，可以用來設(shè)置元素在懸停時顯示出溢出部分。 下面是一個例子，當(dāng)鼠標(biāo)懸停在一個超出部分被隱藏的圖片上時，就會顯示出完整圖片：

div{
width: 200px;
height: 200px;
overflow: hidden;
}
div:hover{
overflow: visible;
}

這樣做的效果是在鼠標(biāo)懸停時將overflow屬性的值從hidden變?yōu)関isible，讓超出部分顯示出來。 總結(jié)一下，使用CSS的overflow屬性可以控制元素的溢出部分是否顯示，而:hover偽類可以讓元素在鼠標(biāo)懸停時顯示出溢出部分。這些屬性和偽類的靈活運用可以帶來很多有趣的效果，讓網(wǎng)頁設(shè)計更加生動有趣。