CSS中的空白效果属性使用小结
OSChina 发布时间：2016-06-21 11:15:15 作者：tacg 
我要评论
我要评论CSS制作空白主要是用到white-space、word-spacing和letter-spacing三个属性,这里就来简单整理一下CSS中的空白效果属性使用小结,需要的朋友可以参考下
white-space
white-space用来设置浏览器对“空白”的处理，所谓的空白指的是你在编辑器里面输入的空格，回车，tab等。他的可选内容如下：
normal： 默认。空白会被浏览器忽略。例如：开头结尾的空白忽略，字之间的，不管多少个多个空格或回车，只显示一个空格，换行前面的空格忽略
pre：空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。
nowrap：不换行，除非遇到<br />，n个空格会被压缩为一个。
pre-wrap：保留所有空白，但是正常地进行换行（chrome，FF，IE8+，Opera），在IE6和IE7下等同于normal
pre-line：合并空白符序列（合并成一个），但是保留换行符（chrome，FF，IE8+，Opera），在IE6和IE7下面等同于normal
word-spacing与letter-spacing
word-spacing 只能作用于英文的单词与单词间，对于中文无效
letter-spacing 可以作用于中文。
CSS Code复制内容到剪贴板
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8"></meta>
- <style type="text/css">
- p.spread {letter-spacing: 30px;}
- </style>
- </head>
- <body>
- <p class="spread">This is some text.哈哈哈哈哈哈哈</p>
- <p class="tight">This is some text.This is some text.</p>
- </body>
- </html>
相关文章
- 又到了对付IE6兼容的时间了,要让img底部留出空白,普通的li写法在IE6下往往会出问题, 下面就关于CSS针对IE6实现网页图片底部留出空白的方法给出一些经验,需要的朋友可以参考2016-05-13
- 这篇文章主要介绍了css空白边叠加的几种情况，如：元素的顶空白边与父元素的顶空白边发生叠加、元素的顶空白边与底空白边发生叠加等等2014-04-21
- css实现瀑布流空白处背景粉色背景块，需要的朋友可以参考一下2013-02-22
- 空白双边距是一个极容易误解的CSS特性.它不是CSS的bug,但如果我们一旦误解,将会给你带来很多麻烦.2010-07-04
- 简单地说，当两个垂直空白边相遇时，它们将形成一个空白边，而这个空白边的高度等于两个发生叠加的空白边的高度中较大者。2010-05-20
- 这篇文章主要介绍了使用CSS代码的空格实现中文对齐的方法,包括 和伪元素等"低成本"方法,需要的朋友可以参考下2015-06-08
- 这篇文章主要介绍使用CSS解决无空格太长的字母、数字不会自动换行的问题，需要的朋友可以参考下2014-05-26
- 想让段落前面空两个字的距离不使用空格了，text-indent可以使得容器内首行缩进一定单位。比如中文段落一般每段前空两个汉字，感兴趣的朋友可以参考下，希望对大家有所帮助2013-09-10
- 相信多数开发者不会多个空格。是偶然发现的，网上多数css格式化将压缩后的css格式化后会发生这个情况。2011-01-12
- CSS样式表空格与不空格的关系2009-12-08
最新评论