div+css使用word-wrap设置自动折行

原创 2007年10月01日 15:57:00

div+css使用word-wrap设置自动折行

[示例代码]

<html>
    <body>
        <div style="word-wrap: break-word;">
            12345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890123456789012345678901234567890<img src="">
        </div>
    </body>
</html>

[注意]

仅对IE有效

[div+css关键词]

div css

[div+css重要工具]

Internet Explorer Developer Toolbar, http://www.microsoft.com/downloads/details.aspx?FamilyID=e59c3964-672d-4511-bb3e-2d5e1db91038&amp;displaylang=en

[div+css的常见问题]

较验div+css格式,http://validator.w3.org/
div+css的margin缩写方式
div+css的padding缩写方式
链接的:link,:visited,:hover,:active四种状态

div+css使用backgroundRepeat样式设置背景图片的显示方式, http://msdn2.microsoft.com/en-us/library/ms530721.aspx

[div+css的浏览器兼容问题]

水平居中,Firefox使用margin-left: auto; margin-right: auto; IE6 使用text-align: center;
垂直居中,Firefox中使用display: table-cell; vertical-align: middle;可以实现div垂直居中,而IE6中则需要借助IE6中css的特点实现垂直居中。
!important标记,Firefox支持!important标记,IE6忽略!important标记,!important需要放在前面才能起作用
手形鼠标指针,使用cursor: pointer;
padding的尺寸,在Firefox中padding是计算在width之外的,而IE6是计算在width之内的
margin的尺寸,在IE6中带有float样式的元素的margin尺寸计算有误,需要借助padding和!important标记实现兼容

使用word-wrap设置自动折行, 仅对IE有效

版权声明:本文为博主(@胡争辉)原创文章,未经博主允许不得转载。

div自动换行word-break:break-all和word-wrap:break-word的区别

word-break:break-all和word-wrap:break-word都是能使其容器如DIV的内容自动换行。 它们的区别就在于: 1,word-break:break-all 例如di...

CSS3之文本换行word-wrap

大家在制作的时候有时候会碰到英文文本超过固定宽度,不会自己换行的问题。这种问题以前解决的时候大多都用overflow:hidden或者JavaScript来控制,让其看起来接近完美。当CSS3出现的时...

自动换行问题(word wrap problem )几种解法之比较

问题描述:

texarea wrap div 自动换行

通常情况下,当用户在输入文本区域中键入文本后,浏览器会将它们按照键入时的状态发送给服务器。只有用户按下 Enter 键的地方生成换行。 如果您希望启动自动换行功能(word wrapping),请将...

使用CSS确定HTML中的断句格式——你真的了解word-wrap和word-break的区别吗

你真的了解word-wrap和word-break的区别吗? 这两个东西是什么,我相信至今还有很多人搞不清,只会死记硬背的写一个word-wrap:break-word;word-break:bre...
  • r5014
  • r5014
  • 2017年06月08日 10:03
  • 208

css 长单词不换行溢出容器的解决方法 word-wrap与word-break

这两个东西是什么,我相信至今还有很多人搞不清,只会死记硬背的写一个word-wrap:break-word;word-break:break-all;这样的东西来强制断句,又或者是因为这两个东西实在是...

css换行(white-space、word-wrap、word-break)

white-space 值 描述 normal 默认。空白会被浏览器忽略。 pre 空白会被浏览器保留。其行为方式类似 HTML 中的 标签。 nowrap 文...

css word-wrap和word-break强制换行

http://www.wufangbo.com/css-qiang-zhi-huan-hang/ 强制换行与强制不换行问题曾经一度困扰着我,每当遇到换行问题时候那就是痛苦回忆的开始,现在终于痛定...

CSS基础---CSS强制性换行(word-wrap;word-break;)

块级元素在其内显示的文字超过其宽度时会自动换行,前提条件是white-space属性值设置为 默认的normal;如果white-space:nowrap;会强制其内的文字在一行显示;及特殊的情况,...
  • J_Y_X_8
  • J_Y_X_8
  • 2016年09月07日 15:41
  • 300

单词太长导致自动换行,出现空白区域。——word-wrap和word-break(英文单词换行)

写在前面:在写页面的时候,偶尔有时会遇到下图这两种情况,一种是单词过长时会溢出div,一种是直接换行,导致出现空白区域。这两个情景就需要word-wrap、word-break这两个属性出场来解决了。...
  • OBKoro1
  • OBKoro1
  • 2017年04月18日 20:11
  • 645
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:div+css使用word-wrap设置自动折行
举报原因:
原因补充:

(最多只允许输入30个字)