【CSS】區塊內捲軸呈現

部分HTML(參考)︰
<div class="DIV22" >
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. 省略之...
</div>

CSS(參考)︰
<style type="text/css">
.DIV22{
scrollbar-DarkShadow-Color:#9FB7D7;   
scrollbar-Track-Color:#F7F7F7;       
scrollbar-Face-Color:#C7CFFF;        
scrollbar-Shadow-Color:#FFFFFF;        
scrollbar-Highlight-Color:#FFFFFF;   
scrollbar-3dLight-Color:#C7CFF7;     
scrollbar-Arrow-Color:#4F5F87;
//以上是捲軸美化相關設定   
overflow-y:auto;   //x捲軸的顯示  【註1】
overflow-x:auto;   //y捲軸的顯示  【註1】
HEIGHT:580px; 
margin-top:15px; 
margin-left:0px;
Color:#000000;
}
</style>

執行畫面︰


【註1】︰
捲軸顯示有四種狀態
visible(預設)︰內容完全顯示不嵌入顯示區域。
auto︰內容嵌入顯示區域,並視情況顯示水平與垂直捲軸。
scroll︰內容嵌入顯示區域,水平捲軸會出現但視情況顯示可捲動或不可捲動。
hidden︰內容嵌入顯示區域,捲軸不會出現。

留言

這個網誌中的熱門文章

【ASP】日期轉換(西元<-->民國)

【VB】使用NPOI元件來匯出Excel--DataTableToExcel

【SQL】符號切割字串變成多欄