`
wangxingguang
  • 浏览: 28223 次
  • 性别: Icon_minigender_1
社区版块
存档分类
最新评论

设置div中文字超出时自动换行

阅读更多

对于div强制换行
1.IE浏览器)white-space:normal; word-break:break-all;这里前者是遵循标准。
#wrap{white-space:normal; width:200px; }
或者
#wrap{word-break:break-all;width:200px;}

2.Firefox浏览器)white-space:normal; word-break:break-all;overflow:hidden;

同样的FF下也没有很好的实现方法,只能隐藏或者加滚动条,当然不加滚动条效果更好!
#wrap{white-space:normal; width:200px; overflow:auto;}
或者
#wrap{word-break:break-all;width:200px; overflow:auto; }

对于table强制换行
1. (IE
浏览器)使用样式table-layout:fixed

2.(IE浏览器)使用样式table-layout:fixednowrap

3. (IE浏览器)在使用百分比固定td大小情况下使用样式table-layout:fixednowrap

4.(Firefox浏览器)在使用百分比固定td大小情况下使用样式table-layout:fixednowrap,并且使用div。

-----------------------------------------------------------------------------------------------------------------------------------

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

四、自动换行:div{ word-wrap: break-word; word-break: normal;}

五、强制英文单词断行:div{word-break:break-all;}

分享到:
评论

相关推荐

    字体超过div范围自动换行

    字体超过div范围自动换行

    div中英文无法自动换行的解决办法

    但是,如果输入的是英文字母,那么,无论你div设定宽度为多少,英文字母都是不换行直接在同一行输出,导致div的宽度远远超出设定的大小。 原因:这是因为div中,英文字母之间没有空格的话,它会默认认为这是一个...

    html内容超出了div的宽度如何换行让内容自动换行

    在工作中评论内容测试遇到评论着的评论内容为:“dddddddddddddddddddddddddddddddddddddddddddddddddd”,错误的评论,在显示评论列表的时候因为有固定宽,但是显示的内容超出的了div的宽,在这种情况下我们需要...

    div+pre标签的组合实现文本原格式显示与自动换行

    而为了限制文本显示的范围,一般使用div+css设定自动换行或缩略等样式。对于未知的文本格式,如果要求文本单行过长时换行显示,并且保留原文本的空格和换行符,就可以通过div+pre标签的组合,再分别设定各自的样式来...

    textarea.zip

    仿微信文本框,自动换行,动态高度,最大四行后滚动。 js监听textarea实时变化值,将textarea内容插入到一个和textarea相同大小的div中,且各属性相同,高度除外;之后将根据div的高度来给textarea的高度赋值,超出...

    guapi233#Blog#textarea高度随内容变化1

    后,该div在页面展示时就拥有了接收输入的能力,同时因为div块状元素的特性,内容在超出宽度时就会换行导致div高度被撑开,如果内容被删除,高度还会自动回复。最

    css样式限制、防止表格被连续英文字母拉长及控制大图片的网页宽度

     标记中<td xss=removed> 这句话的意思就是将单元格的内容自动换行  主要样式word-wrap:break-word   控制大图片的网页宽度 复制代码代码如下: .div1{margin: auto;width: 600px;} .div1 img{max-wi

    ASP ISchool随机抽题考试系统

    1.增加考试强制提交冗余时长设置功能 2.完善操作执行超时提示 3.出现弹出框时自动回到页面顶部 4.修改部分提示,使其更人性化 5.修改操作成功提示,避免遮挡 V3.6.3(20110816) 1.试题列表增加试题点击预览功能 2....

    易语言程序免安装版下载

    易语言5.1 相对于易语言5.0更新说明: ... 修改XML解析支持库,增加写出CDATA数据功能,解决解析XML时错误的丢弃换行和TAB字符的BUG,解决读取节点值时对CDATA数据进行转义处理的BUG。 20. 修改扩展界面支持库...

    js使用小技巧

    让英文字符串超出表格宽度自动换行 word-wrap: break-word; word-break: break-all; 透明背景 <IFRAME src="1.htm" width=300 height=180 allowtransparency></iframe> 获得style内容 obj.style.cssText ...

Global site tag (gtag.js) - Google Analytics