透明滾動框**：
文字
全透明滾動框**：
文字 白底滾動框**：
白底滾動框
滾動框加背景**：文字
左側滾動文字框**如下：文字
**如下：文字
——取自爬山虎，女巫潤色
介紹幾個滾動條配色**：位址1
；位址2
；位址3 ；
附：滾動條（卷軸）語法詳解
1,基本卷軸html語法：
height: 60px; background-color: #996600">編輯文字內容
用法:(替換語法時，注意style=""中的內容，每一部分用"分號 ;"隔開，接著空一格。)
1.當"內容區域"大於"顯示區域"時，可利用卷軸讓看見超出範圍的內容。利用滑
鼠游標調整"顯示區域"，滑鼠游標點選卷軸，會變成可調整大小的狀態，可隨
心所欲的調整大小，語法中的width和height也會隨著變。
ps:去除width:10px的元素，寬會自動擴充套件到最大。
2.語法( overflow: scroll )為顯示右方和下方卷軸。整個還可以分別替換成
★( overflow: auto ) : "內容區域"大於"顯示區域"會自動顯示卷軸，建議使用。
★( overflow: scroll; overflow-x: hidden ): 刪除水平→卷軸。
★( overflow: scroll; overflow-y: hidden ): 刪除垂直↑卷軸。
★( overflow: hidden) : 不使用卷軸。
3.語法( background-color: #996600 )為框框內的背景顏色，#996600 部分為16進製顏
色碼，記得要加上"#"。
ps.整段刪除，背景變成透明狀態。
2.為卷軸加外框
基礎語法中，在style="__"中，在__的地方加入( border: #ff0000 5px dotted )，
情況如下:
height: 60px; background-color: #996600; border: #ff0000 5px dotted">編輯文字內容
加入後，切換編輯列上""(?點我)兩次後，在回到"模式"(?點我)中就會見到，( border: #ff0000 5px dotted )被拆成四部份分別border-right(右邊框)，border-top(上邊框)，border-left(左邊框)， border-bottom(底邊框)變成
(border-right: #ff0000 5px dotted;
border-top: #ff0000 5px dotted;
border-left: #ff0000 5px dotted;
border-bottom: #ff0000 5px dotted )。
用法:(border: #ff0000 5px dotted)或(border-right: #ff0000 5px dotted; border-top: #ff0000 5px dotted; border-left: #ff0000 5px dotted; border-bottom: #ff0000 5px dotted )都有共同結構，分析如下:
( border: #ff0000 5px dotted )
★(#ff0000)框的顏色，#996600 部分為16進製顏色碼，記得要加上"#"，依框的屬性上下左右可調整不同顏色。
★(5px):框的大小,數字越大，框就越粗。0為無框。
★(dotted):框的型別，(dotted)為"點"的型態，可替換其他的有 實線:( solid )，
虛線:( dashed )，立體內凸框:(groove)，立體浮凸框: (ridge)，
雙實線: (double)，凹框: ( inset)，凸框: (outset)，依框的屬性可調整上下左
右使用不同屬性的框。
3.為卷軸調色:
首先取得內容可以用卷軸顏色產生器取得，卷軸顏色產生器**如下:
卷軸顏色產生器
卷軸顏色編輯器
自動卷軸配色編碼器
卷軸顏色生成器
卷軸顏色產生器編輯完成後會得到如下語法:
複製以上所需要反黃部份，此反黃部份為卷軸變色的語法。在基礎語法(見上面1.基本卷軸)中，在style="__"中，在__的地方加入反白部份。注意，每一部分用"分號 ;"隔開，接著空一格。得到的結果如下(加入的語法為畫底線):
html語法：
height: 60px; background-color: #996600; border: #ff0000 5px dotted; scrollbar-face-color: #00ffff;
scrollbar-highlight-color: #ffff00;
scrollbar-shadow-color: #777777;
scrollbar-3dlight-color: #ff0000;
scrollbar-arrow-color: #00ff00;
scrollbar-track-color: #770000;
scrollbar-darkshadow-color: #ff00ff;
scrollbar-base-color: #0000ff">編輯文字內容
用法:
■( scrollbar-face-color: )拖曳棒與按鈕表面顏色。
■( scrollbar-highlight-color: )卷軸與按鈕四周內邊框左上
立體亮面的顏色。
■( scrollbar-shadow-color: )卷軸與按鈕四周內邊框右下立
體暗面的顏色。
■( scrollbar-3dlight-color: )卷軸與按鈕四周外邊邊框左上
立體亮面的顏色。
■( scrollbar-arrow-color: )按鈕箭頭▲▼顏色。
■( scrollbar-track-color: )卷軸軌道的顏色。
■( scrollbar-darkshadow-color: )卷軸與按鈕四周外
邊框右下立體暗面的顏色。
■( scrollbar-base-color: )卷軸整體的顏色，單獨使用效果
比較明顯。
4.變化應用:
1.左側拖曳棒
html語法:
編輯文字內容
2.**的卷軸(只看的見按鈕箭頭▲▼)
html語法:
編輯文字內容
3.透明的卷軸
html語法:
編輯文字內容
4.發光的卷軸
html語法:
編輯文字內容
5.加上背景的卷軸
★背景不跟卷軸移動
html語法:
編輯文字內容
★背景跟卷軸移動
html語法:
編輯文字內容
CSS 滾動條樣式大全
屬性設定 width 148 height 146 根據使用的位置,可調整 寬度和高度.overflow scroll 顯示縱橫滾動條.上部的演示均屬設定為scroll的介面.但一般都設定為 auto 需要時才顯示 background color transparent 滾動框內部背景顏色.tra...
python橫向滾動條 控制滾動條
調過js指令碼控制 python 1.coding utf 8 2.from selenium import webdriver 3.import time 5.driver webdriver.firefox 6.driver.get 7.搜尋 8.driver.find element by i...
谷歌滾動條設定 IE滾動條設定
google瀏覽器chrome設定滾動條樣式 courrlist webkit scrollbar courrlist webkit scrollbar track courrlist webkit scrollbar thumb courrlist webkit scrollbar thumb w...