Hinweis: Diese Methode gilt nur für den -Webkit-Kernel-Browser
Das Erscheinungsbild der Bildlaufleiste besteht aus zwei Teilen:
1 Bildlaufleiste Gleitschiene
2. Bildlaufleiste Schieber in Gleitschiene
In CSS besteht die Bildlaufleiste aus 3 Teilen
name::-webkit-scrollbar //滚动条整体样式 name::-webkit-scrollbar-track //滚动条滑轨 name::-webkit-scrollbar-thumb //滚动条内部滑块
Hinweis: Die oben genannten 3 sind Pseudoklassen , bitte ändern Sie den Namen in den Namen des Elements, das geändert werden muss
(empfohlenes zugehöriges Video-Tutorial: CSS-Video-Tutorial )
Zum Beispiel: Ändern Sie die Schriftrolle Balkenstil der gesamten Seite
body::-webkit-scrollbar{ //先改变body的滚动条宽度
width: 8px;
}
body::-webkit-scrollbar-track{//再改变body的滚动条轨道颜色
background: rgb(200, 200, 200);
border-radius: 5px;
}
body::-webkit-scrollbar-thumb{//最后改变body的滚动条滑轨相关的样式
background: rgb(120, 120, 120);
border-radius: 5px;
}Sie können dem Stil Hintergrund, Transparenz, Rahmen, abgerundete Ecken und andere Attribute hinzufügen, um den Browser schöner zu machen.
Empfohlenes Tutorial: Schnellstart mit CSS
Das obige ist der detaillierte Inhalt vonSo ändern Sie den Stil der Browser-Bildlaufleiste mithilfe von CSS. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!
