Codebeispiel für die Verwendung von CSS zum Ändern des Standardstils der Bildlaufleiste

之前因为公司项目需要,在网上找到的:

直接上代码了

html代码

<p class="inner">
    <p class="innerbox">
        <p style="height:200px;">这是内容111</p>
        <p style="height:400px;">这里是内容222</p>
        <p>这里是内容333</p>
    </p></p>

css代码

　　　　.inner{
            width: 265px;
            height: 400px;
            position: absolute;
            top: 33px;
            left: 13px;            
            /*cursor: pointer;*/
            overflow:hidden;
        }
        .innerbox{
            overflow-x: hidden;
            overflow-y: auto;
            color: #000;
            font-size: .7rem;
            font-family: "\5FAE\8F6F\96C5\9ED1",Helvetica,"黑体",Arial,Tahoma;
            height: 100%;
        }        /*滚动条样式*/
        .innerbox::-webkit-scrollbar {/*滚动条整体样式*/
            width: 4px;     /*高宽分别对应横竖滚动条的尺寸*/
            height: 4px;
        }
        .innerbox::-webkit-scrollbar-thumb {/*滚动条里面小方块*/
            border-radius: 5px;
            -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
            background: rgba(0,0,0,0.2);
        }
        .innerbox::-webkit-scrollbar-track {/*滚动条里面轨道*/
            -webkit-box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
            border-radius: 0;
            background: rgba(0,0,0,0.1);
        }

 

Das obige ist der detaillierte Inhalt vonCodebeispiel für die Verwendung von CSS zum Ändern des Standardstils der Bildlaufleiste. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!