前端培训之如何使文本溢出边界不换行强制在一行内显示

在我们学习前端技术的时候通常我们写一行文本都会在超出部分进行自动换行,那么有些时候我们是需要文本在一行内显示的,这就需要我们想办法实现了,而前端培训过程中一般都会一带而过容易忘记,自学者更加容易忽略。

让文字不自动换行,无论CSS宽度设置多少,所有文字都在一行内显示。特别是标题列表,我们想一行只显示一条标题内容,而有时宽度有限标题文字多了width(宽度)又有限,这样会造成文字自动换行,这个时候我们可以使用white-space样式让他一排显示不换行。

方法:

#test{width:150px;white-space:nowrap;}

设置容器的宽度和white-space为nowrap即可,其效果类似<nobr>标签

想要了解跟多关于前端培训课程内容欢迎关注尚硅谷前端培训,尚硅谷除了这些技术文章外还有免费的高质量前端培训课程视频供广大学员下载学习


上一篇:
下一篇: