概述

CSS的white-space属性用于指定如何处理容器中的空白字符,例如:空格( )、换行(\n)、缩进(\t)等。

white-space出自CSS1,适用于块状元素,具有继承性,支持IE 5.5+、Chrome、FireFox、Safari、Opera等所有主流浏览器,其默认值为normal

说明

white-space支持normalprenowrappre-wrappre-lineinherit等值。下面我们来详细介绍这些值之间的区别。

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

JavaScript操作

white-space在JavaScript中对应的属性名称为whiteSpace,例如:

document.getElementById("p1").style.whiteSpace = "nowrap";

style对象上的whiteSpace属性是可读写的,但是currentStyle对象上的whiteSpace属性是只读的。

CSS white-space属性详解的更多相关文章

  1. DIV css中cursor属性详解-鼠标移到图片变换鼠标形状 (转)

    css中cursor属性详解-鼠标移到图片变换鼠标形状   语法: cursor : auto | all-scroll | col-resize| crosshair | default | han ...

  2. Css盒模型属性详解(margin和padding)

    Css盒模型属性详解(margin和padding) 大家好,我是逆战班的一名学员,今天我来给大家分享一下关于盒模型的知识! 关于盒模型的属性详解及用法 盒模型基本属性有两个:padding和marg ...

  3. CSS中background属性详解

    CSS背景属性 background css 说明 background-image:url(图片的网址); 背景图 background: url( 图片的网址 ); 背景 background-c ...

  4. css中border-sizing属性详解和应用

    box-sizing用于更改用于计算元素宽度和高度的默认的 CSS 盒子模型.它有content-box.border-box和inherit三种取值.inherit指的是从父元素继承box-sizi ...

  5. css 12-CSS3属性详解:动画详解

    12-CSS3属性详解:动画详解 #前言 本文主要内容: 过渡:transition 2D 转换 transform 3D 转换 transform 动画:animation #过渡:transiti ...

  6. [转]CSS vertical-align属性详解 作者:黄映焜

      CSS vertical-align属性详解 posted @ 2014-08-26 17:44 黄映焜   前言:关于vertical-align属性. 实践出真知. 垂直居中. 第二种用法. ...

  7. css动画-animation各个属性详解(转)

    CSS3的animation很容易就能实现各种酷炫的动画,虽然看到别人的成果图会觉得很难,但是如果掌握好各种动画属性,做好酷炫吊炸天的动画都不在话下,好,切入正题. 一.动画属性: 动画属性包括:①a ...

  8. css 14-CSS3属性详解:Web字体

    14-CSS3属性详解:Web字体 #前言 开发人员可以为自已的网页指定特殊的字体(将指定字体提前下载到站点中),无需考虑用户电脑上是否安装了此特殊字体.从此,把特殊字体处理成图片的方式便成为了过去. ...

  9. css 11-CSS3属性详解(一)

    11-CSS3属性详解(一) #前言 我们在上一篇文章中学习了CSS3的选择器,本文来学一下CSS3的一些属性. 本文主要内容: 文本 盒模型中的 box-sizing 属性 处理兼容性问题:私有前缀 ...

  10. css样式继承规则详解

    css样式继承规则详解 一.总结 一句话总结:继承而发生样式冲突时,最近祖先获胜(最近原则). 1.继承中哪些样式不会被继承? 多数边框类属性,比如象Padding(补白),Margin(边界),背景 ...

随机推荐

  1. CENTOS重新安装JDK

    centos 删除默认安装的JDK 重新安装JDK 1.删除JDK 通过xshell工具成功连接安装好的虚拟机之后可通过    rpm -qa | grep java  或 rpm -qa | gre ...

  2. 设计模式学习系列(一)——IOC设计原则

    参考转载自IoC 之 2.1 IoC基础 ——跟我学Spring3

  3. Hybrid App—Hybrid App开发模式介绍和各种开发模式对比

    什么是Hybrid App 最开的App开发只有原生开发这个概念,但自从H5广泛流行后,一种效率更高的开发模式Hybrid应运而生,它就是"Hybrid模式".Hybrid APP ...

  4. 如何使用ASP.NET Core、EF Core、ABP(ASP.NET Boilerplate)创建分层的Web应用程序(第一部分)

    本文是为了学习ABP的使用,是翻译ABP官方文档的一篇实战教程,我暂时是优先翻译自己感兴趣或者比较想学习的部分,后续有时间希望能将ABP系列翻译出来,除了自己能学习外,有可能的话希望帮助一些英文阅读能 ...

  5. Characterization of Dynkin diagrams

    Nowadays, I am reading D.J.Benson's nice book, volume I of Representations and cohomology. I found i ...

  6. Oracle timestamp类型转换成date类型

    今天需要根据时间判断,统一修改某一个字段的数据.然后打开数据库发现,时间类型为timestamp类型.如下: 然后呢,这对我不是喝口水就可以解决的问题吗? 解决方案如下:我需要改这张表某个字段的内容, ...

  7. js作用域零碎的知识点,不同的script块,虽然同是全局变量

    如下代码,第一次弹出a,因为解析器里找到var a,赋予a变量undefined,弹出undefined <!DOCTYPE html> <html> <head> ...

  8. 获取url参数值(可解码中文值)

    /** * 根据指定参数名称获取参数值 * @param {String} urlStr 参数名称 * @return {Object} 参数值 * */ getUrlParams = functio ...

  9. bugku crypto easy-crypto

    长度不一的01字符串 就要考虑是不是摩斯密码 用这个py脚本: from __future__ import print_function a = input("input the stri ...

  10. 基于Python清除破损图片需求实现

    处理同事爬取的图片时,其因爬取过程中因图片类型/网络等问题,获取到较大批次破损图片,现需清除破损文件,并做简要记录. 要点: 在python中,可以使⽤imghdr模块中的what()⽅法判断图⽚⽂件 ...