CSS控制文字的换行与裁剪

 标签<p style="text-align: left;">nowrap 文本不会换行，文本会在在同一行上，直到遇到 <br> 标签为止</p><p style="text-align: left;">pre-wrap 保留空白符序列，但是正常地进行换行(IE7-不支持)</p><p style="text-align: left;">pre-line 合并空白符序列，但保留换行符(IE7-不支持)</p><p style="text-align: left;">inherit规定应该从父元素继承 white-space 属性的值(IE不支持)</p><p style="text-align: left;">应用：</p><p style="text-align: left;"><strong><span style="color:#ff0000">文字溢出显示省略标记（...）：</span></strong></p><p style="text-align: left;"><a href="http://www.php.cn/wiki/868.html" target="_blank">text-overflow</a>: ellipsis;  <br>overflow: hidden;  <br>white-space: nowrap; </p><p style="text-align: left;"><strong><span style="color:#ff0000">文字换行：</span></strong></p><p style="text-align: left;">/* 以单词作为换行依据 */  <br>word-wrap: break-word;  <br>word-break: normal;  <br>/* 以字母作为换行依据 */  <br>word-break: break-all; </p><p style="text-align: left;"><strong><span style="color:#ff0000">文字强制不换行：</span></strong></p><p style="text-align: left;">white-space: nowrap; </p><p>相信看了本文案例你已经掌握了方法，更多精彩请关注php中文网其它相关文章！</p><p>推荐阅读：</p><p><a href="http://www.php.cn/css-tutorial-389754.html" target="_blank">用CSS3实现鼠标浮动放大图片</a><br></p><p><a href="http://www.php.cn/css-tutorial-389744.html" target="_blank">IE8下的nth-child()兼容问题如何处理</a><br></p><p><a href="http://www.php.cn/css-tutorial-389740.html" target="_blank">在CSS边界线消失如何处理</a><br></p><p><span>立即学习</span>“<a href="https://pan.quark.cn/s/cb6835dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记（深入）</a>”；</p>