如何设置css让元素不自动换行

html-css024

如何设置css让元素不自动换行,第1张

关于css让元素换行限制如下：

1强制不换行 div{ white-space:nowrap}

2自动换行 div{ word-wrap: break-wordword-break: normal}

3强制英文单词断行 div{ word-break:break-all}

<style type="text/css">

div{width:300pxborder:1px solid redmargin:10pxoverflow:hidden}

.nowrap{white-space:nowrap}

</style>

<div class="nowrap">这是一段很长的文字，中间没有空格，也没有换行，它不会自动换行直到被截取掉</div>

<div>这是一段很长的文字，中间没有空格，也没有换行，但它会自动换行</div>

上面两个div里超宽的文字，第一个里面的被禁止换行，然后超宽的被截取了；第二个不做设置，于是自动换行了。