So lösen Sie Probleme mit dem Stil der Bildlaufleiste

Ich glaube, viele Kollegen waren durch die Bildlaufleistenstile verschiedener Browser verwirrt und die Standard-Bildlaufleistenstile verschiedener Browser sind nicht konsistent. Im Internet gibt es viele Meinungen zum Ändern des Bildlaufleistenstils, aber die meisten davon sind oberflächlich. Heute werde ich nur über praktische Informationen sprechen, die rein praktischen Informationen stammen aus der Empfehlung eines meiner Kollegen. Hier möchte ich mich bei meinem Kollegen bedanken.

Schritt 1: Sie müssen den folgenden Code in das Tag stylec9ccee2e6ea535a969eb3f532ad9fe89531ac245ce3e4fe3d50054a55f265927 einfügen

/* 设置滚动条的样式 */
    ::-webkit-scrollbar {
        width: 5px;
        height: 5px;
    }
    /* 滚动槽 */
    ::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
        border-radius: 5px;
    }
    /* 滚动条滑块 */
    ::-webkit-scrollbar-thumb {
        border-radius: 10px;
        background: rgba(0, 0, 0, 0.1);
        -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
    }

Schritt 2: Stile zum Container hinzufügen

overflow:auto; (oder overflow-y:auto; oder overflow-x:auto;)

Der Effekt wird nicht veröffentlicht, sodass Sie den wundersamen Moment persönlich miterleben können! Wenn es nicht funktioniert, können Sie gerne einen Stein fallen lassen~

Das obige ist der detaillierte Inhalt vonSo lösen Sie Probleme mit dem Stil der Bildlaufleiste. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!