本站文章中使用了 pre 格式输出 代码。 而浏览器默认是强制不换行输出 pre 里的内容。这样的话,代码一长就出现了撑到页面外部的样子。在之前我都是有意的在代码里强制换行... 累啊. 今天有意的google了下,找到了:
pre {
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}经测试,除IE[当前使用6]外, 其他可以.... 郁闷,然后增加 width:600px; 后,ok,.换行了,其实位置还是衍生出去了。样子是这样的: 代码是在里面了,但下面的叙述性的东西却出了去。在说,定义一个这个宽度也不是个好的方法,其他的不直接改这个css的方法基本没有了。
然后看上面css想到, 为什么定义其他的都用 white-space 而定义 IE 的不使用呢? 又不是IE 不支持。。于是加上就可以了[翻了google的前5页, 没找到一个改css解决的...汗]。
pre {
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
white-space : normal ; /* Internet Explorer 5.5+ */
}
至于本站上使用的是把ie和其他的分开了,因为white-space 在最后也都作用于其他了....
pre {
white-space: pre-wrap; /* css-3 */
white-space: -moz-pre-wrap; /* Mozilla, since 1999 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: -o-pre-wrap; /* Opera 7 */
}
* html pre {
word-wrap: break-word; /* Internet Explorer 5.5+ */
white-space : normal ; /* Internet Explorer 5.5+ */
}
分享到:
相关推荐
### CSS文字自动换行 #### 知识点一:CSS自动换行的原理与方法 在Web开发中,实现文本的自动换行是一项常见的需求。本文档主要介绍了如何利用CSS来实现不同浏览器环境下的自动换行功能,并特别关注了对老旧浏览器...
在CSS(层叠样式表)中,自动换行是一个关键的概念,它关乎着文本在不同屏幕尺寸和布局下的可读性和美观性。本篇将详细探讨CSS如何实现文本的自动换行,以及相关的技巧和最佳实践。 首先,我们来看一个基本的自动...
例如,在JavaScript动态创建元素或者Ajax应用中,我们可以为创建的td元素添加CSS样式来实现自动换行: ```html ;">这里是一段可能会很长的文本,如果太长,它将在任何字符处分行 ``` 需要注意的是,不同的浏览器对...
而浏览器默认是强制不换行输出 pre 里的内容。这样的话,代码一长就出现了撑到页面外部的样子。在之前我都是有意的在代码里强制换行... 累啊. 今天有意的google了下,找到了: [code]pre { whitewhite-space: pre-...
通过上述方法,我们可以有效地解决文本超出容器宽度时的自动换行问题,并且保证了良好的跨浏览器兼容性。在实际项目中,可以根据具体需求选择合适的CSS属性组合,以达到最佳的效果。此外,随着浏览器技术的发展,...
在进行DivCSS布局时,需要对文本进行控制,我们在jb51.net...文本自动处理换行。假如抵达容器边界内容会转到下一行 pre: 换行和其他空白字符都将受到保护。这个值需要IE6+或者 !DOCTYPE 声明为 standards-compliant m
自动换行 复制代码代码如下:{ word-wrap: break-word; word-break: normal; } 强制英文单词断行复制代码代码如下:{ word-break:break-all; } CSS设置不转行: overflow:hidden 隐藏 white-space:normal 默认 pre ...
具体来说,可以尝试调整 `word-wrap` 的值,或者添加额外的CSS属性来增强文本的自动换行能力。 - **使用 `word-break` 属性**:可以通过设置 `word-break: break-all;` 或者 `word-break: break-word;` 来解决纯数字...
总的来说,iText+Flying Saucer生成PDF文档时遇到的中文不显示和不自动换行问题,可以通过调整字体设置、优化CSS布局和正确使用PageBreaker类来解决。在实际开发中,要充分理解这两个库的工作原理,结合实际需求进行...
为了解决这个问题,我们可以利用 CSS 来让 `<pre>` 标签内的文本自动换行。 CSS 中的 `white-space` 属性是用来控制元素内部的空白字符处理方式。有多种值可供选择,如 `normal`、`nowrap`、`pre`、`pre-line` 和 `...
在CSS布局设计中,有效地控制文字的换行和裁剪对于网页的美观性和可读性至关重要。本篇文章将深入探讨CSS中的几个关键属性,包括`word-wrap`、`word-break`和`white-space`,以及如何利用它们来实现各种文字处理效果...
默认情况下,浏览器会自动合并连续的空白字符并处理换行。但通过设置`white-space`,我们可以改变这一行为。例如: - `normal`:默认值,空白字符会被合并,换行也会被折叠。 - `pre`:保留所有空白和换行,就像在...
这使得列表项在容器宽度不足时自动换行到下一行。 在CSS中,`white-space`属性用于设置元素内空白字符的处理方式。它有三个值:`normal`(默认值,内容自动处理换行),`pre`(换行和其他空白字符都将受到保护,...
在网页开发中,GridView控件是ASP...综上所述,处理GridView中的换行问题涉及多个层面,包括CSS样式、数据源处理、列宽设置以及响应式设计等。了解这些知识点,可以帮助我们更好地定制GridView,满足不同场景下的需求。
而为了限制文本显示的范围,一般使用div+css设定自动换行或缩略等样式。对于未知的文本格式,如果要求文本单行过长时换行显示,并且保留原文本的空格和换行符,就可以通过div+pre标签的组合,再分别设定各自的样式来...
根据给定文件,我们可以了解到如何利用CSS的不同属性实现文字不换行、自动换行和强制换行的三种效果。在页面排版中,合理地应用这些技术可以帮助我们处理各种复杂情况下的文本布局问题。 首先,实现页面文字不换行...