css怎么设置强制不换行溢出显示省略号？

css可以使用white-space:nowrap;样式使元素内文本不换行，然后使用text-overflow:ellipsis;样式设置元素内文本超出显示省略号。

css设置强制不换行溢出显示省略号的方法介绍：

1、css设置强制不换行：

我们可以通过为元素设置css样式white-space:nowrap;使元素内文本不换行。white-space属性设置如何处理元素内的空白。

规定段落中的文本不进行换行css代码：

p
  {  white-space: nowrap
  }

2、css设置超出显示省略号：

text-overflow属性确定如何向用户发出未显示的溢出内容信号。它可以被剪切，显示一个省略号（'...'，U + 2026 HORIZONTAL ELLIPSIS）或显示一个自定义字符串。

语法：

text-overflow: clip|ellipsis|string;

设置div内超出省略号显示css代码：

div.test
{
text-overflow:ellipsis;
}

3、设置超出显示省略号示例：

<html>
<head>
<style type="text/css">
p
{   
    width:500px;

    white-space: nowrap;

    text-overflow: ellipsis;

    overflow: hidden;
}
</style>
</head>
<body>

<p>
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
这是一些文本。
</p>

</body>
</html>

效果图：