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
