`
zhangyaochun
  • 浏览: 2620501 次
  • 性别: Icon_minigender_1
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

white-space

阅读更多

本文来自w3school:http://www.w3school.com.cn/css/pr_text_white-space.asp

 

个人简单记录,学习参考,感谢!

 

white-space-----设置如何处理元素内的空白

 

 

默认值: 继承性: 版本: JavaScript 语法:
normal
yes
CSS1
object.style.whiteSpace="pre"

 

 

兼容性所有浏览器多支持white-space属性。

 

 

normal 默认。空白会被浏览器忽略
pre 空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。
nowrap 文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。
pre-wrap 保留空白符序列,但是正常地进行换行。
pre-line 合并空白符序列,但是保留换行符。
inherit 规定应该从父元素继承 white-space 属性的值。

 

 

注意:

 

 1。 IE不支持inherit

 2。 pre-wrap和pre-line是CSS2.1中新增的。

分享到:
评论

相关推荐

    collapse-white-space:用单个空格替换多个空格字符

    import { collapseWhiteSpace } from 'collapse-white-space' collapseWhiteSpace ( '\tfoo \n\tbar \t\r\nbaz' ) //=&gt; ' foo bar baz' 原料药 该程序包导出以下标识符: collapseWhiteSpace 。 没有默认导出。 ...

    CSS属性 - white-space 空白属性使用说明

    CSS 属性 - white-space 空白属性使用说明 白白空属性是 CSS 中一个重要的属性,它用于控制 HTML 元素中的空白处理。通过设置 white-space 属性,我们可以控制文本在元素中的换行、空格和制表符等空白符的处理方式...

    css中强制换行word-break、word-wrap、white-space区别实例说明

    复制代码代码如下:”c1″&gt;safjaskflasjfklsajfklasjflksajflksjflkasfdsafdsfksafj&lt;/div&gt;&lt;div class=c1&gt;This is all English. This is all English. This is all English.&lt;/div&gt;&lt;div class=c1&gt;全是中文的情况。...

    css文本换行属性word-wrap和white-space使用总结

    今天碰到了td文字内容不换行,发现是:white-space: nowrap,即强制文本不进行换行,顺便看了一下文本换行的属性word-wrap,总结如下: white-space的默认只是normal,自动换行。 word-break:break-all和word-wrap:...

    css white-space:nowrap属性用法(可以强制文字不换行输出)

    在CSS中,`white-space` 属性用于控制元素内的空白符处理方式,它允许开发者对文本的换行、缩进和空白字符的行为进行定制。在某些场景下,我们可能需要强制文本不换行,保持在一行内显示,这就是`white-space: ...

    使用white-space来阻止文字显示自动换行

    `white-space` CSS 属性正是为此而生,它允许我们精确地定义文本如何处理空白、换行和其他空白字符。在标题提及的场景中,`white-space` 被用来阻止文字自动换行,以确保所有文字都在同一行内显示,即使内容超过了...

    white-space:nowrap的应用

    为了解决这个问题,我们可以利用CSS中的`white-space: nowrap`属性。 `white-space`属性控制元素内的空白字符如何处理。默认情况下,浏览器会自动折行以适应容器的宽度,但`white-space: nowrap`属性则禁止这种自动...

    IE6,IE7下实现white-space:pre-wrap

    `white-space` 是一个关键的CSS属性,它决定了浏览器如何处理元素内的空白字符,如空格、制表符和换行符。`white-space: pre-wrap` 是这个属性的一个值,它允许保留空白符和换行,同时支持自动换行,使得内容可以在...

    美工之路 网页设计视频教程CSS篇-15.文本:空白white-space.rar

    美工之路系列视频是为那些想从事网页前台设计的设计师们和网页设计爱好者量身定制的,本教程包含4个部分:HTML篇,CSS篇,Javascript篇和XML篇.不仅适用于网页设计的初学者,对中级以上水平的人员也有一定参考价值,使...

    CSS 数字和字母将容器撑大问题解决

    对于div,p等块级元素 正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义的宽度之后自动换行 html &lt;div id=wrap&gt;正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal...

    TV-White-Space-Prototype:即将在 UCL 与意大利 ICTP 合作创建的电视空白空间可视化网站的概念验证游乐场

    TV-White-Space-Prototype-master这个文件名可能代表项目源代码的主分支或初始版本。在这样的代码仓库中,我们可能会找到以下内容: 1. HTML文件:包含网页的基本结构和布局。 2. CSS文件:定义网页的样式和视觉...

    h5实现移动端横向滚动tab,并响应内容

    white-space: nowrap; } .tab { flex: 1; padding: 16px; text-align: center; } ``` 为了让内容响应式,我们可以使用媒体查询(`media query`)来调整不同屏幕尺寸下的显示。例如,当屏幕宽度小于某个值时,...

    前端开源库-dom-whitespace

    在"dom-whitespace-master"这个压缩包中,你可能找到以下内容: - `src`目录:包含库的源代码文件,可能有JavaScript模块,如`index.js`,实现上述功能。 - `dist`目录:编译后的库文件,可能包括UMD(Universal ...

    微信小程序实现列表的横向滑动方式

    white-space:nowrap;//不换行 overflow-x: auto;子元素设置: display:inline-block; 方式二:scroll-view 标签 + 样式 scroll-view的横向滚动: scroll-view的内层view元素需要:display:inline-block; scroll-...

    控制台打印文字效果js插件-typed.js

    **标题解析:** "控制台打印文字效果js插件-typed.js" 指的是一种JavaScript插件,名为`typed.js`,它的主要功能是模拟控制台中的文字打印效果,为网页添加动态输入的视觉体验。 **描述分析:** 描述中提到,`typed...

Global site tag (gtag.js) - Google Analytics