您好!欢迎来到e资源!本站资源24小时自动发货,海量精品课程资源免费下载!

html pre标签自动换行的css实现

在html语言中,pre标签中的文本会保留空格和换行符,因此常用来原样输出程序代码。不过,pre标签的这个功能也导致了它不能自动换行的问题。我们使用如下的css,可以让pre标签自动换行pre {white-space: pre-wrap;...

在html语言中,pre标签中的文本会保留空格和换行符,因此常用来原样输出程序代码。

不过,pre标签的这个功能也导致了它不能自动换行的问题。

我们使用如下的css,可以让pre标签自动换行

pre {
    white-space: pre-wrap;
    word-wrap: break-word;
}

其中:

white-space: pre-wrap;表示:保留空白符序列,但是正常地进行换行。

word-wrap: break-word表示:允许长单词或 URL 地址换行到下一行。

经测试,在IE10,chrome下,只需要white-space: pre-wrap;就可以实现自动换行

在IE6下,pre标签必须加上word-wrap: break-word;才能实现自动换行。

开通vip
首页 导航 会员 客服 微信
QQ 微信 邮箱 TOP