Html、Css中控制文字实现不换行超出部分隐藏显示省略号

很多时候在程序的前端模板中，调用网站文章标题的时候，部分标题很长，需要对这种特别长的标题文字进行处理，让这种特别长的标题文字实现不换行并让超出父级元素宽度的部分隐藏起来，并让隐藏的超出部分文字显示省略号，这需要对所包含标题的Html代码结构的Css进行设置。

例如李涛自留地的每个页面的侧边栏的热门文章、最新文章模块就是对超出的标题文字进行了不换行超出部分隐藏并显示省略号。

主要是在css中设置以下几种样式就可以实现控制文字实现不换行超出部分隐藏显示省略号：

overflow: hidden;white-space: nowrap;text-overflow: ellipsis;

overflow主要是设置文字溢出显示，而white-space主要是设置文字是否换行，text-overflow是设置溢出的文字如何形式显示出来，如何设置其属性为ellipsis就是溢出的文字显示省略号。

Html、Css中控制文字实现不换行超出部分隐藏显示省略号要点：注意需要对父级盒子的宽度进行设置，如果父级盒子容器没有对宽度进行设置，就不会显示省略号。