Summary of html scroll bar style settings

We have previously introduced the settings of css scroll bars and div scroll bars. We all know that the style of the scroll bar can be controlled through css. What about the html scroll bar? Today I will introduce to you a summary of HTML scroll bar style settings!

Scroll bar style in html;

1.html scroll bar style_basic tutorial

1. The track of the scroll bar is recorded as: scrollbar-track. The so-called "track" refers to the route that the sliding block of the scroll bar must take when running. 2. The sliding block of the scroll bar, that is, the sliding block that can be moved up and down or left and right by pressing and holding the left mouse button, and the small squares at both ends of the scroll bar, recorded as: scrollbar-face. Face is the "face" of the scroll bar. Note that it has three "faces": the slide bar and the small squares at both ends.

2.html scroll bar textarea attribute setting

1． Overflow Settings when the content overflows (setting whether the set object displays scroll bars)

overflow-x Settings when the horizontal content overflows

overflow-y Settings when the vertical content overflows

The values ​​set for the above three attributes are visible (default value), scroll, hidden, and auto.

3.html scroll bar modification

I used This, if it exceeds this height, a vertical scroll bar will appear. This vertical scroll bar is not good-looking. Is there any way to remove this vertical scroll bar, but content that exceeds 150 height can still be scrolled by rolling the mouse wheel? Or is there a way to achieve scrolling with buttons above and below?

4.About scroll bars in HTML/removing scroll bars



This code is the same as the above The only difference is that in the elements defined by css, one is body and the other is html. Let's test it again and change the "body" of the html page to "html" to test it and find that the effect can still be achieved. So why?

5.How to hide scroll bars and remove scroll bars in HTML



This article describes a small The editor introduces to you the HTML code for hiding scroll bars and removing scroll bars. I hope it will be helpful to you. If you have any questions, please leave me a message and I will reply to you in time.

html scroll bar related questions and answers:

##1.html5 - Baidu Ueditor code high Why does the light conflict with the code segment scroll bar?

2.html - css::-webkit-scrollbar can only set the width of the vertical scroll bar ? ? How to set the width of the horizontal scroll bar??

3.css3 - As the scroll bar slides down, how to achieve the effect of each part of the page appearing? ’s

[Related article recommendations]:

1.Use html and css code Summary of implementing various table styles

2.Summary of methods to implement mouse styles in html and css

3. Summary of methods for introducing css styles into html

The above is the detailed content of Summary of html scroll bar style settings. For more information, please follow other related articles on the PHP Chinese website!