更改瀏覽器的滾動條樣式


  body{
            scrollbar-arrow-color: red; /*上下按鈕上三角箭頭的顏色*/
            scrollbar-face-color: #CBCBCB; /*滾動條凸出部分的顏色*/
            scrollbar-3dlight-color: blue; /*滾動條亮邊的顏色*/
            scrollbar-highlight-color: #333; /*滾動條空白部分的顏色*/
            scrollbar-shadow-color: yellow; /*滾動條陰影的顏色*/
            scrollbar-darkshadow-color: green; /*滾動條強陰影的顏色*/
            scrollbar-track-color: #eee; /*滾動條背景顏色*/

            scrollbar-base-color: black; /*滾動條的基本顏色*/
            Cursor:url(mouse.cur); /*自定義個性鼠標*/
            /*以上2項適用與:body、div、textarea、iframe*/
        }


        ::-webkit-scrollbar {  /* 滾動條整體部分 */
            width:10px;
            margin-right:2px
        }
        ::-webkit-scrollbar-button { /* 滾動條兩端的按鈕 */
            width:10px;
            background-color: yellow;
        }
        ::-webkit-scrollbar:horizontal {
            height:10px;
            margin-bottom:2px
        }
        ::-webkit-scrollbar-track {  /* 外層軌道 */
            border-radius: 10px;
        }
        ::-webkit-scrollbar-track-piece {  /*內層軌道,滾動條中間部分 */
            background-color: #333333;
            border-radius: 10px;
        }
        ::-webkit-scrollbar-thumb {  /* 滑塊 */
            width:10px;
            border-radius: 5px;
            background: #CBCBCB;
        }
        ::-webkit-scrollbar-corner { /* 邊角 */
            width: 10px;
            background-color: red;
        }
        ::-webkit-scrollbar-thumb:hover { /* 鼠標移入滑塊 */
            background: #909090;
        }
        .demo {
            width: 400px;
            height: 200px;
            overflow: auto;
        }

  

<div class="demo">

        <ul style="width: 600px;">
            <li>
                2011年2月17日,互聯網實驗室在北京發布《互聯網研究調查報告》,該報告中指出我國互聯網產業已出現寡頭壟斷現象,騰訊、百度和阿里巴巴三家公司在其各自領域位居中國互聯網壟斷企業前三名。 各大媒體於是將這家公司稱為三巨頭,之后逐漸演變成BAT。

                雖然都是三巨頭,但是差距卻在不斷擴大。目前(8月19日),騰訊的市值已達到2490億美元,高於阿里的2460億美元,成為中國市值最高的科技公司。然而百度才剛剛608億美元,與阿里和騰訊相去甚遠。

                不僅BAT之間的差距在擴大,很多互聯網公司也追趕了上來。之前落后,但是如今形勢大好的網易,還有京東、小米、樂視、滴滴出行等等。到底誰有可能成為中國互聯網的第四極呢?
            </li>
            <li>
                2011年2月17日,互聯網實驗室在北京發布《互聯網研究調查報告》,該報告中指出我國互聯網產業已出現寡頭壟斷現象,騰訊、百度和阿里巴巴三家公司在其各自領域位居中國互聯網壟斷企業前三名。 各大媒體於是將這家公司稱為三巨頭,之后逐漸演變成BAT。

                雖然都是三巨頭,但是差距卻在不斷擴大。目前(8月19日),騰訊的市值已達到2490億美元,高於阿里的2460億美元,成為中國市值最高的科技公司。然而百度才剛剛608億美元,與阿里和騰訊相去甚遠。

                不僅BAT之間的差距在擴大,很多互聯網公司也追趕了上來。之前落后,但是如今形勢大好的網易,還有京東、小米、樂視、滴滴出行等等。到底誰有可能成為中國互聯網的第四極呢?
            </li>
            <li>
                2011年2月17日,互聯網實驗室在北京發布《互聯網研究調查報告》,該報告中指出我國互聯網產業已出現寡頭壟斷現象,騰訊、百度和阿里巴巴三家公司在其各自領域位居中國互聯網壟斷企業前三名。 各大媒體於是將這家公司稱為三巨頭,之后逐漸演變成BAT。

                雖然都是三巨頭,但是差距卻在不斷擴大。目前(8月19日),騰訊的市值已達到2490億美元,高於阿里的2460億美元,成為中國市值最高的科技公司。然而百度才剛剛608億美元,與阿里和騰訊相去甚遠。

                不僅BAT之間的差距在擴大,很多互聯網公司也追趕了上來。之前落后,但是如今形勢大好的網易,還有京東、小米、樂視、滴滴出行等等。到底誰有可能成為中國互聯網的第四極呢?
            </li>
            <li>
                2011年2月17日,互聯網實驗室在北京發布《互聯網研究調查報告》,該報告中指出我國互聯網產業已出現寡頭壟斷現象,騰訊、百度和阿里巴巴三家公司在其各自領域位居中國互聯網壟斷企業前三名。 各大媒體於是將這家公司稱為三巨頭,之后逐漸演變成BAT。

                雖然都是三巨頭,但是差距卻在不斷擴大。目前(8月19日),騰訊的市值已達到2490億美元,高於阿里的2460億美元,成為中國市值最高的科技公司。然而百度才剛剛608億美元,與阿里和騰訊相去甚遠。

                不僅BAT之間的差距在擴大,很多互聯網公司也追趕了上來。之前落后,但是如今形勢大好的網易,還有京東、小米、樂視、滴滴出行等等。到底誰有可能成為中國互聯網的第四極呢?
            </li>
            <li>
                2011年2月17日,互聯網實驗室在北京發布《互聯網研究調查報告》,該報告中指出我國互聯網產業已出現寡頭壟斷現象,騰訊、百度和阿里巴巴三家公司在其各自領域位居中國互聯網壟斷企業前三名。 各大媒體於是將這家公司稱為三巨頭,之后逐漸演變成BAT。

                雖然都是三巨頭,但是差距卻在不斷擴大。目前(8月19日),騰訊的市值已達到2490億美元,高於阿里的2460億美元,成為中國市值最高的科技公司。然而百度才剛剛608億美元,與阿里和騰訊相去甚遠。

                不僅BAT之間的差距在擴大,很多互聯網公司也追趕了上來。之前落后,但是如今形勢大好的網易,還有京東、小米、樂視、滴滴出行等等。到底誰有可能成為中國互聯網的第四極呢?
            </li>
        </ul>
    </div>

  

效果圖:

來源:《超實用的CSS代碼》

IT技術和行業交流群 417691667

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM