white-space属性:

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

可能的值

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

这个属性在我做过的项目中是以规定导航条下拉菜单的布局风格,如果我不设置white-space,则其长度会继承一级菜单的长度,且超出部分会换行。当我设置white-space:nowrap,如右图:

  
 
如果元素的 white-space 设置为 pre-wrap,那么该元素中的文本会保留空白符序列,但是文本行会正常地换行。pre-line 与 pre-wrap 相反,会像正常文本中一样合并空白符序列,但保留换行符,如下表的区别,pre-line和pre-wrap的区别就是,一个合并空白符,一个不合并。
 
空白符 换行符 自动换行
pre-line 合并 保留 允许
normal 合并 忽略 允许
nowrap 合并 忽略 不允许
pre 保留 保留 不允许
pre-wrap 保留 保留 允许

待更新...

【笔记】W3C CSS关键属性的更多相关文章

  1. 2.前端笔记之css

    title: 1.前端笔记之CSS date: 2016-04-05 23:05:51 tags: 前端 categories: w3c --- 作者:刘耀 **出处:http://www.liuya ...

  2. PHP笔记(CSS篇)

    HTML常用于在网页中显示内容,当然,还可以是布局,但是比较不方便,所以,引进了CSS CSS全称Cascading Style Sheets,中文名:层叠样式表 帮助文档:CSS.chm 作用:布局 ...

  3. CSS z-index 属性的使用方法和层级树的概念

    之前有一篇文章提到过z-index,我们知道只有在元素设置了position部位static时才生效,而且z-index也跟父元素有关系,今天就在ie7遇到类似问题,在网上查了一些资料,发现一篇好文章 ...

  4. 【转】CSS z-index 属性的使用方法和层级树的概念

    文章转自:CSS z-index 属性的使用方法和层级树的概念,另外加了一点自己的注释 CSS 中的 z-index 属性用于设置节点的堆叠顺序, 拥有更高堆叠顺序的节点将显示在堆叠顺序较低的节点前面 ...

  5. css之属性部分

    这篇写的是今天的学习到的属性,一共20个. 属性再多,但也要会使用,会在使用时可以记起它,才能起到它为我们所需要的作用. 样式属性 1.border CSS边框属性允许你指定一个元素边框的样式和颜色. ...

  6. css z-index属性

    原文地址:http://www.neoease.com/css-z-index-property-and-layering-tree/ CSS 中的 z-index 属性用于设置节点的堆叠顺序, 拥有 ...

  7. [转] CSS direction属性简介与实际应用 ---张鑫旭

    一.用的少并不代表没有用 至少,在我接触的这么多项目里,没有见到使用过CSS direction属性做实际开发的. 为什么呢?是因为direction长得丑吗? 虽然说direction确实其貌不扬, ...

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

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

  9. CSS vertical-align属性

    之前也经常用到vertical-align进行垂直居中对齐,突然发现其中的一些属性值根本就没使用过,也不清楚效果,将今天的研究成果记录下. vertical-align 属性 下表是w3c上列举的属性 ...

随机推荐

  1. 重构16-Encapsulate Conditional(封装条件)

    当代码中充斥着若干条件判断时,代码的真正意图会迷失于这些条件判断之中.这时我喜欢将条件判断提取到一个易于读取的属性或方法(如果有参数)中.重构之前的代码如下: ) { return "doS ...

  2. pxe+kickstart实现无人值守批量安装linux

    pxe+kickstart实现无人值守批量安装linux 实验准备:主机myrhel2作为服务器端,新建一个没有安装操作系统的虚拟主机,而且其与服务器端在同一个网段 安装的条件: 服务器端:      ...

  3. Shodan!

    Shodan! 简介 首先先介绍一下Shodan CNNMoney的一篇文章写道,虽然目前人们都认为谷歌是最强劲的搜索引擎,但Shodan才是互联网上最可怕的搜索引擎. 与谷歌不同的是,Shodan不 ...

  4. Providers、Controller 、Service、DirectiveFactory

    Providers 是唯一一种你可以传进 .config() 函数的 service.当你想要在 service 对象启用之前,先进行模块范围的配置,那就应该用 provider Controller ...

  5. poj 2455 Secret Milking Machine 二分+最大流 sap

    题目:p条路,连接n个节点,现在需要从节点1到节点n,不重复走过一条路且走t次,最小化这t次中连接两个节点最长的那条路的值. 分析:二分答案,对于<=二分的值的边建边,跑一次最大流即可. #in ...

  6. 转: 视频相关的协议族介绍(rtsp, hls, rtmp)

    转自: http://www.zhihu.com/question/20621558   作者:杨华链接:http://www.zhihu.com/question/20621558/answer/1 ...

  7. python实现发送邮件功能

    '''套接字是为特定的网络协议(例如TCP/IP,ICMP/IP,UDP/IP等),允许程序和接受并进行连接,要在python 中建立具有TCP和流套接字的简单服务器,需要使用socket模块,利用该 ...

  8. SQL server 2008 建立新用户

    进入Instance下的‘安全性’->登录名, 可以选择SQL server 验证,‘强制实施密码策略’.’状态‘ 为启用. 在使用的数据库下‘安全性’->登录名,选择‘登录名’,输入之前 ...

  9. 自定义input file 属性

    <label class="input"><input title="浏览文件" type="file" />浏览… ...

  10. JavaScript原型(链)学习笔记

    javascript是基于原型的一门脚本语言,那究竟原型是什么? 本文将从以下几个方面重点阐述原型 构造函数是什么? 构造函数和我们常见的Array String有什么关系? 原型的使用? __pro ...