div+pre标签的组合实现文本原格式显示与自动换行
2014-02-27 16:53
1131 查看
html的<pre></pre>标签用可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。
而为了限制文本显示的范围,一般使用div+css设定自动换行或缩略等样式。对于未知的文本格式,如果要求文本单行过长时换行显示,并且保留原文本的空格和换行符,就可以通过div+pre标签的组合,再分别设定各自的样式来实现(pre标签一般不适用width属性)
而为了限制文本显示的范围,一般使用div+css设定自动换行或缩略等样式。对于未知的文本格式,如果要求文本单行过长时换行显示,并且保留原文本的空格和换行符,就可以通过div+pre标签的组合,再分别设定各自的样式来实现(pre标签一般不适用width属性)
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>TEST</title> <style type="text/css"> div { width: 100px; white-space: normal; } pre { white-space: pre-wrap; /*css-3*/ white-space: -moz-pre-wrap; /*Mozilla,since1999*/ white-space: -pre-wrap; /*Opera4-6*/ white-space: -o-pre-wrap; /*Opera7*/ word-wrap: break-word; /*InternetExplorer5.5+*/ } </style> <body> <div> <pre> 文本文本文本文本文本文本文本文本文本文本文本 文本 文本 文本 </pre> </div> </body> </html>
相关文章推荐
- div+pre标签的组合实现文本原格式显示与自动换行
- div+css实现文本原格式显示与自动换行
- 设置div中文字超出时自动换行和css实现文本超出N行之后显示省略号等
- 如何实现:GridView 控件中显示的文本不自动换行,隐藏超出宽度部分wj-wangjun
- GridView实现自动编号;GridView实现自定义时间货币等字符串格式;GridView实现用“...”代替超长字符串;GridView一般换行与强制换行;GridView显示隐藏某一列;
- pre标签实现自动换行
- ueditor文本超过编辑器宽度不换行问题(使pre标签内容自动换行)
- html pre标签使文本自动换行
- Android自定义控件实现标签的显示自动换行(一)
- CSS实现div添加过长的英文字母或数字的内容显示一排而溢出时,进行自动换行
- CSS实现div添加过长的英文字母或数字的内容显示一排而溢出时,进行自动换行
- J2ME简单灵活实现手机中自动换行显示文本
- 如何让div中的长文本自动换行
- DIV文字自动换行的实现
- 实现TEXTAREA数据写入数据库后提取出来原样显示在网页TABLE上并自动换行
- UltraEdit的Tab键移动位数设置 && UE编辑十六进制(映像修改) && UE加进右键菜单 && UE切换自动换行 && UE高亮显示其他编程语言文本
- CSS、div实现自动换行
- javascript实现的一个自定义长度的文本自动换行的函数。
- Xcode9学习笔记25 - 文本标签的自动换行UILabel,lineBreakMode
- symbian显示文本自动换行