資料結構
網路
關係型資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究哪個屬性用於告訴瀏覽器，如果盒子的內容大於盒子本身該怎麼辦？
CSS 提供了一個名為 overflow 的屬性，用於告訴瀏覽器如果盒子的內容大於盒子本身該怎麼辦。此屬性可以取以下值之一：
| 值 | 描述 |
|---|---|
| visible | 允許內容溢位其包含元素的邊框。 |
| hidden | 巢狀元素的內容在包含元素的邊框處被簡單地截斷，並且沒有捲軸可見。 |
| scroll | 包含元素的大小不會改變，但會新增捲軸以允許使用者滾動檢視內容。 |
| auto | 目的與 scroll 相同，但只有在內容溢位時才會顯示捲軸。 |
示例
您可以嘗試執行以下程式碼來實現 overflow 屬性：
<html>
<head>
</head>
<style>
.scroll{
display:block;
border: 2px solid green;
padding:10px;
margin-top:10px;
width:300px;
height:50px;
overflow:scroll;
}
.auto{
display:block;
border: 2px solid green;
padding:10px;
margin-top:10px;
width:300px;
height:50px;
overflow:auto;
}
</style>
<body>
<p>Example of scroll value:</p>
<div class = "scroll">
I am going to keep lot of content here just to show you how
scrollbars works if there is an overflow in an element box.
This provides your horizontal as well as vertical scrollbars.
</div>
<br />
<p>Example of auto value:</p>
<div class = "auto">
I am going to keep lot of content here just to show you how scrollbars
works if there is an overflow in an element box. This provides your
horizontal as well as vertical scrollbars.
</div>
</body>
</html>
更新於： 2020-06-25
135 次檢視
廣告