CSS intercepts extra characters in the string and displays them with ellipsis.

During website creation, when the List displays the news title or product title, the string is too long, leading to incorrect page layout. How can this problem be solved?ProgramThe method of intercepting extra characters. Here we introduce a method implemented using CSS styles, because the text still exists on the page, but it is not displayed, so it is also good for Seo optimization.

First, you must set the width and height, and then use a style such:

. Cuttitle{Display:Block;Width:220px;Height:24px;Overflow:Hidden;White-space:Nowrap;-O-text-Overflow:Ellipsis;Text-Overflow:Ellipsis;}<Ul> <li class = 'cuttitle'> truncated redundant characters <li> </Lu>
 

 

In this way, the title is automatically truncated when it exceeds the length.