In addition to Weibo, there is also WeChat
Please pay attention
WeChat public account
Shulou
2025-04-01 Update From: SLTechnology News&Howtos shulou NAV: SLTechnology News&Howtos > Development >
Share
Shulou(Shulou.com)06/03 Report--
This article is about how to use CSS's overflow. The editor thinks it is very practical, so share it with you as a reference and follow the editor to have a look.
1. Overflow grammatical value
Overflow: visible | auto | hidden | scroll
Of course, overflow can separately set the scroll bar style in the X (overflow-x) and Y (overflow-y) directions with the same value as the application and overflow syntax usage structure.
II. Interpretation of Overflow parameter values
Visible: do not cut the content or add scroll bars. If you explicitly declare this default value, the object will be cut to the size of the window or frame that contains the object. And the clip property setting will be invalidated
Auto: this is the default value for body objects and textarea. Cut content and add scroll bars as needed, which is also the default value for DIV, but you can set it when you need to set it.
Hidden: does not display content that exceeds the object size
Scroll: always show scroll bar
3. Special explanation of Overflow
Retrieves or sets how to manage content when the content of an object exceeds its specified height and width.
Setting the textarea object to the hidden value hides its scroll bar.
For table, if the table-layout property is set to fixed, the td object supports the overflow property with a default value of hidden. If set to hidden,scroll or auto, content beyond the size of the td will be cut. If set to visible, it will cause additional text to overflow to cells on the right or left (depending on the direction property setting). This property is available on MAC platforms as of IE5.
Focus on learning Overflow
Overflow:visible this style allows the scroll bar to be hidden, but the mouse can be pulled and slid up and down.
Overflow:hidden hides the content of the object beyond the set width and height
Overflow:scroll this style causes the content to display a scroll bar regardless of whether it exceeds the height width or not.
V. Overflow:hidden and Overflow:scroll practice
We use the same width and height setting, one hides the content beyond the width height, one to display the scroll bar, and for the case demonstration, we add a CSS border border to the case 2 objects.
CSS Code:
. divcss5-hidden,.divcss5-scroll {width:300px; height:100px;line-height:25px; border:1px solid # 333}. Divcss5-hidden {overflow:hidden; height:50px}. Divcss5-scroll {overflow:scroll; margin-top:10px}
Html Code:
Hide the excess content without showing scrolling. Divcss5's overflow:hidden test demonstration case sets the high and wide rear objects, and the content does not exceed the objects.
Thank you for reading! This is the end of the article on "how to use the overflow of CSS". I hope the above content can be of some help to you, so that you can learn more knowledge. if you think the article is good, you can share it for more people to see!
Welcome to subscribe "Shulou Technology Information " to get latest news, interesting things and hot topics in the IT industry, and controls the hottest and latest Internet news, technology news and IT industry trends.
Views: 0
*The comments in the above article only represent the author's personal views and do not represent the views and positions of this website. If you have more insights, please feel free to contribute and share.
Continue with the installation of the previous hadoop.First, install zookooper1. Decompress zookoope
"Every 5-10 years, there's a rare product, a really special, very unusual product that's the most un
© 2024 shulou.com SLNews company. All rights reserved.