资讯专栏INFORMATION COLUMN

CSS之换行

RobinQu / 1881人阅读

摘要:在项目中,常常遇到一些问题,可以通过来快速解决,比如受到布局影响会导致内容溢出,这个时候就可以使用换行解决自动换行强制不换行允许在英文单词内断行只在允许的断字点处换行允许在长单词或内部换行空白会被浏览器忽略

     在项目中,常常遇到一些问题,可以通过CSS来快速解决,比如受到布局影响会导致内容溢出,这个时候就可以使用CSS换行解决

     自动换行: { word-wrap:break-word; }

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

     允许在英文单词内断行: { word-break:break-all; }

 

     word-wrap:  normal  (只在允许的断字点处换行)

                        break-word  (允许在长单词或URL内部换行)

 

     white-space: normal  (空白会被浏览器忽略)

                            pre (空白会被浏览器保留)

                            nowrap (文本不会换行,直到遇见

                            pre-wrap (保留空白符序列,但会正常的换行)

                            pre-line (合并空白符序列,但会保留换行符)

 

       word-break: normal(浏览器默认的换行规则)

                             break-all (允许在单词内换行)

                             keep-all(只能在半角空格或连字符处换行)

 

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/1869.html

相关文章

  • 【转】css样式自动换行(强制换行

    摘要:原文链接自动换行问题正常字符的换行是比较合理的而连续的数字和英文字符常常将容器撑大挺让人头疼下面介绍的是如何实现换行的方法对于等块级元素正常文字的换行亚洲文字和非亚洲文字元素拥有默认的当定义的宽度之后自动换行正常文字的换行亚洲文字和非亚洲 原文链接:http://blog.csdn.net/ye987987... 自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容...

    ASCH 评论0 收藏0
  • 【转】css样式自动换行(强制换行

    摘要:原文链接自动换行问题正常字符的换行是比较合理的而连续的数字和英文字符常常将容器撑大挺让人头疼下面介绍的是如何实现换行的方法对于等块级元素正常文字的换行亚洲文字和非亚洲文字元素拥有默认的当定义的宽度之后自动换行正常文字的换行亚洲文字和非亚洲 原文链接:http://blog.csdn.net/ye987987... 自动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容...

    时飞 评论0 收藏0
  • css文本换行总结

    摘要:到文本过长的问题,元素的宽度不足以容那文本的内容,文本超出元素显示,遇到这种情况,一般有两种处理方式,一种是超出省略不显示,很暴力,很直接,还有一种就是换行显示,下面我将会介绍几种种常用的换行方法。但文本内的换行无效。 到文本过长的问题,元素的宽度不足以容那文本的内容,文本超出元素显示,遇到这种情况,一般有两种处理方式,一种是超出省略不显示,很暴力,很直接,还有一种就是换行显示,下面我...

    Caizhenhao 评论0 收藏0
  • 谈谈如何用CSS处理文本格式

    摘要:一个长单词超出整个容器宽度时是否换行必须注意到,这是一个长单词便超出容器宽度的情况,而且只需考虑英文,中文没有此特性。规定如何处理内容溢出容器属性作用于型元素上。 前言 文本方面的CSS内容不少,但只要是用过一下office word来编辑过文章的童鞋都能轻易理解其中的大部分。那么,今天仅仅来谈谈其中最复杂的部分——文本格式。 处理换行、空格和Tab:white-space 众所周知,...

    source 评论0 收藏0

发表评论

0条评论

RobinQu

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<