The CSS Property: whitespace

The whitespace property in CSS is used to control how white spaces inside an element are handled.

There are several values you can use with whitespace:

• normal: Sequences of white space are collapsed. Newline characters are treated as spaces, and consecutive whitespace characters are collapsed into one.
• nowrap: Sequences of white space are collapsed. Text will never wrap to the next line. This is similar to setting overflowwrap: normal and wordwrap: normal.
• pre: Sequences of white space are preserved. Text will only wrap on line breaks and <br> elements.
• prewrap: Sequences of white space are preserved. Text will wrap when necessary, and at line breaks.
• preline: Sequences of white space are collapsed. Text will wrap when necessary, and at line breaks.

Let's say you have a container with a fixed width and you want to ensure text does not wrap:

.container {
  width: 200px;
  whitespace: nowrap;
  overflow: hidden;
  textoverflow: ellipsis;
}
  

In the above example, text within the container will not wrap onto a new line. Instead, it will be truncated with an ellipsis (...) if it overflows the container.

Use whitespace: nowrap; when you want to prevent text from wrapping, especially in cases like navigation menus or table cells where you want text to remain on a single line.

Remember to consider the overall layout and design of your page when using whitespace, as it directly affects how text content is displayed.

Tags： 涨乐财富通电脑版

版权声明： 免责声明：本网站部分内容由用户自行上传，若侵犯了您的权益，请联系我们处理，谢谢！联系QQ：2760375052