css如何实现不换行
导读:收集整理的这篇文章主要介绍了css如何实现不换行,觉得挺不错的,现在分享给大家,也给大家做个参考。css实现不换行的方法使用【word-break】属性规定自动换行的处理,可以让浏览器实现在任意位置的换行,语法为【word-break: n...
收集整理的这篇文章主要介绍了css如何实现不换行,觉得挺不错的,现在分享给大家,也给大家做个参考。css实现不换行的方法使用【word-break】属性规定自动换行的处理,可以让浏览器实现在任意位置的换行,语法为【word-break: normal|break-all|keep-all】。
本教程操作环境:windows7系统、css3版,DELL G3电脑。
word-break 属性规定自动换行的处理方法。通过使用 word-break 属性,可以让浏览器实现在任意位置的换行。
语法:
word-break: normal|break-all|keep-all;
属性值:
normal 使用浏览器默认的换行规则。
break-all 允许在单词内换行。
keep-all 只能在半角空格或连字符处换行。
示例:
!DOCTYPE htML> html> head> style> p.test1{ width:11em; border:1px solid #000000; word-break:hyphenate; } p.test2{ width:11em; border:1px solid #000000; word-break:break-all; } /style> /head> body> p class="test1"> This is a veryveryveryveryveryveryveryveryveryvery long paragraph./p> p class="test2"> This is a veryveryveryveryveryveryveryveryveryvery long paragraph./p> p> b> 注释:/b> 目前 opera 不支持 word-break 属性。/p> /body> /html>
效果图:
相关学习推荐:css教程
以上就是css如何实现不换行的详细内容,更多请关注其它相关文章!
声明:本文内容由网友自发贡献,本站不承担相应法律责任。对本内容有异议或投诉,请联系2913721942#qq.com核实处理,我们将尽快回复您,谢谢合作!
若转载请注明出处: css如何实现不换行
本文地址: https://pptw.com/jishu/589005.html