上QQ阅读APP看书，第一时间看更新
5.1.2 文本换行
如果元素中的文本超出了元素本身的宽度，默认情况下会自行换行。在Bootstrap 4中可以使用.text-nowrap类来阻止文本换行。
在下面的示例中定义了两个宽度为15rem的div，第一个没有添加text-nowrap类来阻止文本换行，第二个添加了text-nowrap类来阻止文本换行。
【例5.3】文本换行示例。
在IE 11浏览器中运行结果如图5-4所示。
图5-4 文本换行效果
在Bootstrap中，对于较长的文本内容，如果超出了元素盒子的宽度，可以添加.text-truncate类，以省略号的形式表示超出的文本内容。
注意
添加.text-truncate类的元素，只有包含display: inline-block或display:block样式，才能实现效果。
在示例中，给定div的宽度，然后添加.text-truncate类。当文本内容溢出时，将以省略号显示。
【例5.4】省略溢出文本示例。
在IE 11浏览器中运行结果如图5-5所示。
图5-5 省略溢出文本效果