Use css to customize scroll bars for webkit-based browsers_html/css_WEB-ITnose

Using css to set the scroll bar of the webkit kernel browser mainly sets the following 7 attributes:
1.::-webkit-scrollbar /*The entire part of the scroll bar, you can set the width and height*/
2.: :-webkit-scrollbar-button /*Buttons at both ends of the scroll bar*/
3.::-webkit-scrollbar-track /*Outer track*/
4.::-webkit-scrollbar-track- piece /*Inner scroll groove*/
5.::-webkit-scrollbar-thumb /*Scrolling slider*/
6.::-webkit-scrollbar-corner /*Corner*/

7.::-webkit-resizer /*Define the style of the drag block in the lower right corner*/

Some other attributes:

:horizontal horizontal scroll bar
:vertical vertical scrollbar
:decrement applies to buttons and inner track pieces. It is used to indicate whether the button or inner track will reduce the position of the window (for example, above the vertical scroll bar, to the left of the horizontal scroll bar.)
:increment decrement is similar, used to indicate whether the button or inner track will reduce the position of the window. Increase the position of the viewport (for example, below the vertical scroll bar and to the right of the horizontal scroll bar.)
The :start pseudo-class also applies to buttons and sliders. It is used to define whether the object is placed in front of the slider.
:end is similar to the start pseudo-class, identifying whether the object is placed behind the slider.
:double-button This pseudo-class is used for buttons and inner tracks. Used to determine whether a button is one of a pair of buttons placed at the same end of the scroll bar. For inner tracks, this indicates whether the inner track is next to a pair of buttons.
:single-button is similar to the double-button pseudo-class. For buttons, it is used to determine whether a button is independently in a section of the scroll bar. For inner tracks, it indicates whether the inner track is next to a single-button.
:no-button is used for the inner track, indicating whether the inner track should scroll to the end of the scroll bar, for example, when there are no buttons at both ends of the scroll bar.
:corner-present is used for all scroll bar tracks, indicating whether the scroll bar rounded corners are displayed.
:window-inactive is used for all scroll bar tracks, indicating whether a page container (element) to which the scroll bar is applied is currently activated. (In recent versions of webkit, this pseudo-class can also be used for the ::selection pseudo-element. The webkit team plans to extend it and promote it to become a standard pseudo-class)