1. Text abbreviation

ellipsis {
    
    
  white-space: nowrap; /*强制内容在一行显示*/
  overflow: hidden; /*超出部分溢出*/
  text-overflow: ellipsis; /*溢出的部分使用省略号*/
}

Two, white-space

white-spaceAttributes set within the processing element空白

2.1 What are the blanks?

Space(空格)、Enter(回车)、Tab(制表符)

In development, no matter how many spaces and carriage returns we hit, the ones displayed on the page will be merged into one.
When our text exceeds one line, it will automatically wrap.

2.2 Attribute value

Attributes	Effect	compatible
normal (default)	All spaces, carriage returns, and tabs are combined into one space, and the text automatically wraps	IE7\IE6+
nowrap	All spaces, carriage returns, and tabs are combined into one space, and the text does not wrap	IE7\IE6+
pre	Everything is output as-is, text is not wrapped	IE7\IE6+
pre-wrap	Everything is output as-is, text wraps	IE8+
pre-line	All spaces and tabs are merged into one space, the carriage return remains unchanged, and the text wraps	IE8+
you inherit	Inherit parent element	IE does not support and is not recommended

Three, overflow

CSS overflowproperties are used to control 溢出元素框时the way content is displayed.

attribute value

value	describe
visible	Defaults. The content will not be clipped and will be rendered outside the element's box.
hidden	The content is trimmed and the rest of the content is invisible.
scroll	The content is trimmed, but the browser displays scroll bars to view the rest of the content.
auto	If the content is trimmed, the browser displays scroll bars to view the rest of the content.
you inherit	Specifies that the value of the overflow attribute should be inherited from the parent element.

Fourth, text-overflow

text-overflowThe attribute specifies that when 文本溢出the element that contains it, should 如何显示. You can set overflow, text 被剪切, 显示省略号 (...)or display 自定义字符串(not supported by all browsers)

attribute value

value	describe
clip	Cut text.
ellipsis	Show ellipses... to represent trimmed text.
string	Use the given string to represent the trimmed text.
initial	Set as property default.
you inherit	Inherit the attribute value from the parent element.

css implements text abbreviation & text overflow omission processing