zoukankan      html  css  js  c++  java
  • wordbreak和wordwrap

    word-break和word-wrap很多情况上去都一样,看了一个上午也没看透他们的区别。

    例子:

    .mbox h2 span.top_notice
    	{ 
    	font: normal 12px "宋体"; 
    	position: absolute; 
    	right: 10px; 
    	bottom: 1px;  
    	line-height: 40px; 
    	padding-left: 20px; 
    	background:url(/static/css/i/top_notice.gif) no-repeat 0 12px; 
    	overflow: hidden; 
    	 480px; 
    	height: 40px; 
    	text-overflow:ellipsis;
    	white-space:nowrap;
    } 
    

    word-break
    语法:
    word-break : normal | break-all | keep-all
     
    参数:
    normal :  依照亚洲语言和非亚洲语言的文本规则,允许在字内换行
    break-all :  该行为与亚洲语言的normal相同。也允许非亚洲语言文本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本
    keep-all :  与所有非亚洲语言的normal相同。对于中文,韩文,日文,不允许字断开。适合包含少量亚洲文本的非亚洲文本
     
    说明:
    设置或检索对象内文本的字内换行行为。尤其在出现多种语言时。
    对于中文,应该使用break-all 。

    1.break-all
    只要超出宽度,不管什么内容都换行(文字,英文,数字)。
    2.normal
    区分文字和英文(数字),如果超出部分遇到文字,那么就换行,如果是英文和数字,那么将整个(英文和数字)都放到下一行。
    3.keep-all
    不管什么内容(文字,英文,数字)都不换行,除非有字断开。


    word-wrap
    语法:
    word-wrap : normal | break-word
     
    参数:
    normal :  允许内容顶开指定的容器边界
    break-word :  内容将在边界内换行。如果需要,词内换行(word-break)也行发生
     
    说明:
    设置或检索当当前行超过指定容器的边界时是否断开转行。

    1.break-word
    使用break-word时,是将强制换行。中文没有任何问题,英文语句也没问题。但是对于长串的英文,就不起作用。
    2.normal
    区分文字和英文(数字),如果超出部分遇到文字,那么就换行,如果是英文和数字,那么将整个(英文和数字)都放到下一行。

    学透前端行业所有技术,玩遍北京周边所有城市。然后我会回到那个生我养我的地方,因为有亲人的地方才是家。
  • 相关阅读:
    Spring(二):Spring框架&Hello Spring
    Spring(一):eclipse上安装spring开发插件&下载Spring开发包
    MyBatis(三):数据库查询结果不为空,但是使用MyBatis框架查询为空问题
    wrapper x64 版本发布到centos
    Oracle:常用的一些基本操作
    Java:import com.sun.awt.AWTUtilities;报错
    Eclipse中JavaSwing图形插件安装
    Hibernate(五):Hibernate配置文件及C3P0的用法
    Hibernate(四):Hello World
    Hibernate(三): org.hibernate.HibernateException: No CurrentSessionContext configured!
  • 原文地址:https://www.cnblogs.com/snowinmay/p/2839681.html
Copyright © 2011-2022 走看看