How to solve the problem of displaying half of the text in the last row of HTML

This article mainly introduces the HTML last row of text display half how to solve the relevant knowledge, detailed and easy to understand, simple and fast operation, with a certain reference value, I believe that everyone reading this HTML last row of text display half how to solve the article will have some gains, let's take a look at it.

HTML+CSS example code

CSS5 instances appear incomplete or over-span. CSS5 {border:1px solid #000;width:200px;overflow:hidden;height:50px;line-height:20px} last line calligraphy appears incomplete last line calligraphy appears half test DIVCSS instance test

2. Screenshots of case achievements

3, CSS layout text flash incomplete cause analysis The above case and the first overflow DIV box code is the same, only more overflow:hidden style. This "overflow:hidden" pattern has a latent DIV pattern, so the last row of ink appears incomplete or only half displayed.

4, the solution covet method or refer to the previous CSS compatibility problem "the last row of text more than across the DIV border" lost very good operation.

4-1: Reduce the number of lines of text (reduce one line here)

4-2 Set the height of the equipment and compete well with each other

4-3: Do not set height

4-4: Total corrected line-height values when height is stationary

About "HTML last row of text display half how to solve" the content of this article is introduced here, thank you for reading! I believe everyone has a certain understanding of the knowledge of "how to solve the problem of displaying half of the last row of HTML text." If you still want to learn more knowledge, please pay attention to the industry information channel.