電腦資訊 線上筆記本

此功能在安裝軟體或註冊帳號時常常會出現，大多應用在「服務條款」、「會員規範」、「論壇版規」等等上面。主要是可避免畫面拉得太長，可將內容塞在一個框架裡，讓使用者透過捲軸來查看內容。以下將透過範例進行說明。

【CSS】

.box {
　　border:1px solid #cccccc;
　　width:300px;
　　height:100px;
　　background-color:#FFFFFF;
　　padding:5px;
　　overflow:auto;
}

【HTML】

<div class="box">
　　//內容<br><br><br><br><br><br><br><br><br><br>
</div>

※以上<br>標籤是為了讓內容超出框架範圍使捲軸出現

《說明》

首先建立一個區塊(div)， 透過CSS調整所需的高(height)、寬(width)、文字與區塊的間距(padding)，再設定框線(border)與區塊的背景色(backgound-color)，接著透過overflow自動判斷區塊內容是否有超出框架，如果有將會自動顯示出捲軸。

【如果這篇文章剛好有幫助到你，希望能幫我按個讚給我個鼓勵】

【這樣小小的一個動作，對我來說就是給我最大的回禮】