CSS网页布局强制换行和强制不换行的属性讲解
互联网 发布时间:2008-10-17 19:24:40 作者:佚名 我要评论
在CSS网页布局中,常常会遇到这样的问题,强制文字换行,而不是在一行内显示撑开容器影响布局。而有些时候可能会强制内容不换行,多出的部分隐藏掉即可,关于强制不换行与强制换行的一些CSS属性WEBJX.com作一些整理,希望能给大家的工作和学习提供参考。
先了解
在CSS网页布局中,常常会遇到这样的问题,强制文字换行,而不是在一行内显示撑开容器影响布局。而有些时候可能会强制内容不换行,多出的部分隐藏掉即可,关于强制不换行与强制换行的一些CSS属性WEBJX.com作一些整理,希望能给大家的工作和学习提供参考。
先了解以下几个属性:
强制不换行
p.www_jb51_com{
white-space:nowrap;
}
自动换行
p.www_jb51_com{
word-wrap:break-word;
word-break:normal;
}
强制英文单词断行
p.www_jb51_com{
word-break:break-all;
}
CSS设置不换行:
overflow:hidden溢出隐藏
white-space:nowrap不换行
pre换行和其他空白字符都将受到保护
nowrap强制在同一行内显示所有文本,直到文本结束或者遭遇br对象
CSS设置强制换行:
word-break:break-all强制断开实现转行
normal;依照亚洲语言和非亚洲语言的文本规则,允许在字内换行
break-all:该行为与亚洲语言的normal相同。也允许非亚洲语言文本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本
keep-all:与所有非亚洲语言的normal相同。对于中文,韩文,日文,不允许字断开。适合包含少量亚洲文本的非亚洲文本与之间的高度解决办法
设置或检索对象内文本的字内换行行为。尤其在出现多种语言时。对于中文,应该使用break-all。
相关文章
- 在项目中我们经常需要在文本过长时显示,将文本超出的部分内容用省略号代替,基于css代码是怎么实现的呢?下面脚本之家小编通过分析本文给大家详解,感兴趣的朋友一起学习2016-01-19
- li中的文本超出行宽自动隐藏,在一些新闻类的列表应用中还是比较实用的,具体的实现css样式如下,感兴趣的朋友可以参考下,希望对大家有所帮助2013-09-29
- 连续的数字和英文字符常常将容器撑大,挺让人头疼。下面与大家分享下CSS如何实现换行的方法,从事web前端的朋友可以看看哦2014-10-17
- css文本控制包括越界省略号以及自动换行,具体示例代码如下,大家可以测试下2014-03-09
如何实现FireFox文本自动换行-CSS教程-网页制作-网页教学网
FireFox文本自动换行处理,如何实现FireFox文本自动换行 文本自动换行IE中解决方法: word-wrap:break-word; word-break:break-all; 注:在要换行的内容相应的单元2008-10-17- 这篇文章主要介绍了CSS超出文本指定宽度用省略号代替和文本不换行的相关资料,小编觉的实用性非常,特此分享到脚本之家平台,供大家参考2016-05-05
最新评论