How to control the number of output words in css

Css method to control the number of output words: first create an HTML sample file; then define some text; finally implement text overflow display through css styles "overflow:hidden;" and "text-overflow:ellipsis;" The ellipsis effect will do.

The operating environment of this tutorial: windows7 system, HTML5&&CSS3 version, Dell G3 computer.

For text content, there are two common ways to limit the word count. The most common is to limit the number of words output when the background program outputs, and the other is to use css on the front end to control text overflow. It is recommended to use a program to limit the number of words output. For content padding or element overflow, this falls into the category of CSS non-standardization and compatibility.

The following is a list of css writing methods for text overflow and ellipsis:

{
overflow:hidden;
text-overflow:ellipsis;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;(这里是行数 你可以控制你想在第几行末尾多余的显示省略号，之前的文本正常显示)
}

Extended information

CSS (Cascading Style Sheet)

Cascading Style Sheet (full name in English) : Cascading Style Sheets) is a computer language used to express document styles such as HTML (an application of Standard Generalized Markup Language) or XML (a subset of Standard Generalized Markup Language). CSS can not only statically modify web pages, but can also cooperate with various scripting languages ​​to dynamically format various elements of web pages.

CSS can perform pixel-level precise control over the layout of element positions in web pages, supports almost all font size styles, and has the ability to edit web page objects and model styles.

Recommended: "css video tutorial"

The above is the detailed content of How to control the number of output words in css. For more information, please follow other related articles on the PHP Chinese website!