【笔记】W3C CSS关键属性
white-space属性:
white-space 属性设置如何处理元素内的空白。
可能的值
值 | 描述 |
---|---|
normal | 默认值,合并所有空格,换行符会被浏览器忽略 |
pre | 空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。 |
nowrap | 文本不会换行,文本会在在同一行上继续,直到遇到 <br> 标签为止。 |
pre-wrap | 保留空白符序列,但是正常地进行换行。 |
pre-line | 合并空白符序列,但是保留换行符。 |
inherit | 规定应该从父元素继承 white-space 属性的值。 |
这个属性在我做过的项目中是以规定导航条下拉菜单的布局风格,如果我不设置white-space,则其长度会继承一级菜单的长度,且超出部分会换行。当我设置white-space:nowrap,如右图:
值 | 空白符 | 换行符 | 自动换行 |
---|---|---|---|
pre-line | 合并 | 保留 | 允许 |
normal | 合并 | 忽略 | 允许 |
nowrap | 合并 | 忽略 | 不允许 |
pre | 保留 | 保留 | 不允许 |
pre-wrap | 保留 | 保留 | 允许 |
待更新...
【笔记】W3C CSS关键属性的更多相关文章
- 2.前端笔记之css
title: 1.前端笔记之CSS date: 2016-04-05 23:05:51 tags: 前端 categories: w3c --- 作者:刘耀 **出处:http://www.liuya ...
- PHP笔记(CSS篇)
HTML常用于在网页中显示内容,当然,还可以是布局,但是比较不方便,所以,引进了CSS CSS全称Cascading Style Sheets,中文名:层叠样式表 帮助文档:CSS.chm 作用:布局 ...
- CSS z-index 属性的使用方法和层级树的概念
之前有一篇文章提到过z-index,我们知道只有在元素设置了position部位static时才生效,而且z-index也跟父元素有关系,今天就在ie7遇到类似问题,在网上查了一些资料,发现一篇好文章 ...
- 【转】CSS z-index 属性的使用方法和层级树的概念
文章转自:CSS z-index 属性的使用方法和层级树的概念,另外加了一点自己的注释 CSS 中的 z-index 属性用于设置节点的堆叠顺序, 拥有更高堆叠顺序的节点将显示在堆叠顺序较低的节点前面 ...
- css之属性部分
这篇写的是今天的学习到的属性,一共20个. 属性再多,但也要会使用,会在使用时可以记起它,才能起到它为我们所需要的作用. 样式属性 1.border CSS边框属性允许你指定一个元素边框的样式和颜色. ...
- css z-index属性
原文地址:http://www.neoease.com/css-z-index-property-and-layering-tree/ CSS 中的 z-index 属性用于设置节点的堆叠顺序, 拥有 ...
- [转] CSS direction属性简介与实际应用 ---张鑫旭
一.用的少并不代表没有用 至少,在我接触的这么多项目里,没有见到使用过CSS direction属性做实际开发的. 为什么呢?是因为direction长得丑吗? 虽然说direction确实其貌不扬, ...
- [转]CSS vertical-align属性详解 作者:黄映焜
CSS vertical-align属性详解 posted @ 2014-08-26 17:44 黄映焜 前言:关于vertical-align属性. 实践出真知. 垂直居中. 第二种用法. ...
- CSS vertical-align属性
之前也经常用到vertical-align进行垂直居中对齐,突然发现其中的一些属性值根本就没使用过,也不清楚效果,将今天的研究成果记录下. vertical-align 属性 下表是w3c上列举的属性 ...
随机推荐
- 控制Input框输入的为大写字母
本来我的想法是Jquery来控制的,万万没想到...用Css就可以实现!!!! .toUp input{ text-transform:uppercase; } 感谢: http:// ...
- 在ios开发中nil和NUll和Nilde区别————和如何判断连个对象的关系和UISlider不能拖动的问题
nil表示一个对象指针为空,针对对象 >示例代码: NSString *someString = nil; NSURL *someURL = nil; id someObject = nil; ...
- Java学习笔记——JDK1.7的新特性。
1,switch中可以使用字串 Java代码: String s = "test"; switch (s) { case "test" : System.out ...
- PHP使用外部命令导出数据库,备份到服务器并下载到本地
<?php // $dumpFileName目录要有可写权限 $DbHost = 'localhost'; $DbUser = 'root'; $DbPwd = '123456'; $DbNam ...
- VMware系统运维(八)vCenter Server安装
1.终于开始安装vCenter Server了,需要配置数据源哦! 2.下一步 3.接受协议,下一步 4.输入许可密钥,也可以后面再输入,下一步 5.选择数据源,即我们前面配置的系统DSN,下一步 6 ...
- ionic中的ion-content与ion-scroll
ion-content形成上下结构,上面固定,下层可滑动 首先要设置ion-content不可滑动:<ion-content class="has-subheader" sc ...
- springMVC第一课--配置文件
刚学springMVC,记录下学习过程,供以后查阅(githup源码). 1,新建一个web工程.(其他按常规来) 如下:添加applicationContext.xml,webmvc-servlet ...
- 【BUG】---ng-show/ng-hide修改成功但没有效果
问题:点击搜索,隐藏tab,出现搜索结果列表,调试也成功修改了分别元素的ng-hide就是没有效果 我的错误: <div ng-hide="{{isShow}}" class ...
- 【CSS3】---为边框应用图片 border-image
为边框应用图片 border-image 顾名思义就是为边框应用背景图片,它和我们常用的background属性比较相似.例如: background:url(xx.jpg) 10px 20px no ...
- 清除层div浮动
clearboth { clear: both; display: block; height: 0; font-size: 0; overflow: hidden; } <div class= ...