Shulou(Shulou.com)05/31 Report--

This article mainly introduces the relevant knowledge of "html hiding text beyond the part of the method", the editor shows you the operation process through the actual case, the operation method is simple and fast, practical, I hope that this "html hidden text beyond part of the method" article can help you solve the problem.

The way to hide the excess part of html text is to add the overflow property to the text box and set the property value to hidden, for example, [overflow:hidden;]. Hidden indicates that the content will be trimmed and the rest of the content will not be visible.

This article operating environment: windows10 system, html 5, thinkpad T480 computer.

The overflow attribute specifies what happens if the content overflows the box of an element.

Attribute value:

Visible default value. The content will not be trimmed and will be rendered outside the element box.

The hidden content is trimmed and the rest of the content is not visible.

The scroll content is trimmed, but the browser displays a scroll bar to see the rest of the content.

Auto if the content is trimmed, the browser displays a scroll bar to view the rest of the content.

Inherit states that the value of the overflow attribute should be inherited from the parent element.

The code example is as follows:

(php.cn) div.ex1 {background-color: lightblue; width: 110px; height: 110px; overflow: scroll;} div.ex2 {background-color: lightblue; width: 110px; height: 110px; overflow: hidden;} div.ex3 {background-color: lightblue; width: 110px; height: 110px; overflow: auto;} div.ex4 {background-color: lightblue; width: 110px; height: 110px; overflow: visible;} overflow attribute

If the content in the element exceeds the given width and height attributes, the overflow attribute determines whether behaviors such as scroll bars are displayed.

Overflow: scroll: provide a large number of free, original, high-definition php video tutorials, and regular public welfare php training! Php from entry to mastery, one-stop php self-learning platform! overflow: hidden: provide a large number of free, original, high-definition php video tutorials, and regularly hold public welfare php training! Php from entry to mastery, one-stop php self-learning platform! overflow: auto: provide a large number of free, original, high-definition php video tutorials, and regularly hold public welfare php training! Php from entry to mastery, one-stop php self-learning platform! overflow: visible (default): provide a large number of free, original, high-definition php video tutorials, and regularly hold public welfare php training! You can modify the sample code online while learning to see the implementation effect! php from entry to proficiency, one-stop php self-learning platform! This is the end of the content about "how to hide the extra part of the text in html". Thank you for reading. If you want to know more about the industry, you can follow the industry information channel. The editor will update different knowledge points for you every day.

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.