css小發現：隱藏捲軸、強迫物件換行

有時在設定固定範圍物件時，總會有那麼奇怪的事發生：
就是捲軸竟然出現了！明明就剛剛好大小，怎麼會發生這樣的事呢…

這時就有css的設定出現了：


overflow-y: scroll;
overflow-x: hidden;

有x跟y兩個

除此之外，相關的設定有：



加入/隱藏捲軸語法

預設使用捲軸        overflow:auto;
刪除捲軸               overflow:hidden;
刪除水平捲軸        overflow-x:hidden;
刪除垂直捲軸        overflow-y:hidden;


捲軸變色

可放在所有有捲軸的地方，一般來說放在html{}裡就可。

html{
scrollbar-face-color: 色碼;    /*捲軸顏色*/
scrollbar-highlight-color: 色碼;    /*捲軸左與上內邊框*/
scrollbar-shadow-color: 色碼;    /*捲軸右與下內邊框*/
scrollbar-3dlight-color: 色碼;     /*捲軸左與上外邊框*/
scrollbar-darkshadow-color: 色碼;    /*捲軸右與下外邊框*/
scrollbar-arrow-color: 色碼;    /*捲軸箭頭*/
scrollbar-track-color: 色碼;   /*捲軸底色*/
}


捲軸左置

建議不要把主框架捲軸左置；文字會變成全部倒反，會不太好處理。

捲軸左置語法    direction: rtl;

語法加在你想改的捲軸語法欄位即可(有捲軸的地方皆可)。
例如我想把主選單的捲軸左置則:#links {direction: rtl;}


資料夾、欄位加入捲軸

有些欄位(最新回應、最新引用...之類)，總是佔了大部分的頁面..
把它加個捲軸，就不會這麼佔位置了!

要加入的語法   height: 150px; overflow: auto;    (高度自訂)

備註：若要強制在某欄位裡加上捲軸語法，別忘了要加上高度的語法！
          作用是在於使用捲軸的欄位若超過多少高度就會出現捲軸!


引用來源：http://www.wretch.cc/blog/yehcathy/2275794


這個語法很多人在設計部落格或網頁時，都會用到的。
可是Firefox不會顯示喔，IE為基本的瀏覽器就可以了。捲軸 框線語法範例↓
html{
SCROLLBAR-FACE-COLOR: #色碼;
SCROLLBAR-HIGHLIGHT-COLOR: #色碼;
SCROLLBAR-SHADOW-COLOR: #色碼;
SCROLLBAR-3DLIGHT-COLOR: #色碼;
SCROLLBAR-DARKSHADOW-COLOR: #色碼;
SCROLLBAR-ARROW-COLOR: #色碼;
SCROLLBAR-TRACK-COLOR: #色碼; }


語法說明↓ 附上白色系列的範例
......................................................................................................
html{
SCROLLBAR-FACE-COLOR: #FFFFFF; ←[白色] 長條捲軸顏色
SCROLLBAR-HIGHLIGHT-COLOR:FFFFFF; ←[白色]捲軸 明亮色
SCROLLBAR-SHADOW-COLOR: FFFFFF; ←[白色] 捲軸陰暗色
SCROLLBAR-3DLIGHT-COLOR:#E0E0E0; ←[灰色] 長條捲軸內框線
SCROLLBAR-DARKSHADOW-COLOR: #E0E0E0; ←[灰色] 長條捲軸外框線
SCROLLBAR-ARROW-COLOR: #FF0033; ←[紅色] 三角箭頭顏色
SCROLLBAR-TRACK-COLOR:#000000 ; }←[黑色] 長條捲軸軌道背景色




引用來源：http://pinkyvivi.pixnet.net/blog/post/14395996