目前致力于在Web开发时，不可避免要用到CSS，把我这几年在Web开发过程中积累的一些不常用但是很实用的CSS整理了一下，希望对大家有所帮助！
filter:chroma(color:#FFFFFF);
让指定的背景色透明，例:
 |
|
| 未使用该滤镜 | 使用该滤镜 |
word-break:break-all;
强制换行，例:
当未使用该样式时，虽然我设置了表格宽度为100px，但是面对这样连续的字符，表格无法自动换行，表格会被撑破:
| aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa |
再看看使用该样式后的效果:
| aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa |
writing-mode:tb-rl;
用于设置文本的书写方向，可以有两个取值：
lr-tb：表示左右-上下，left right - top bottom
tb-rl：表示上下-右左，top bottom - right left
需要 IE 5.5+ 才支持，例:
第二组水平文字第三组竖直文字第三组水平文字
text-indent:2em;
首行缩进，例:
有时候，我们需要将段落的首行缩进两个文字，一般我们都是用4个HTML的空格( )来实现，其实我们还可以用样式表来达到这种效果！
background-color: transparent;
transparent表示透明色，例:
border-collapse:collapse;
它会自动把相同的边框线合并，例:
不使用border-collapse:collapse;
| 1.1 | 1.2 |
| 2.1 | 2.2 |
| 1.1 | 1.2 |
| 2.1 | 2.2 |
background-position: 0 -78;
设置背景图片的位置，例:
《background-position的妙用》
table-layout: fixed;
固定布局的算法。在这算法中，水平布局是仅仅基于表格的宽度，表格边框的宽度，单元格间距，列的宽度，而和表格内容无关。也就是说，内容可能被裁切，例:
看看我以前写的一个仿msn的htc网格中应用这个属性的效果吧，仿照MSN的网格，单元格中文字过长会自动被截取（在Table中使用样式table-layout: fixed;），鼠标移上会全部显示(使用一个浮动的层覆盖在上面)：
演示 下载
display:inline;
设置或检索对象是否及如何显示，inline表示内联，例:
大家都知道两个表格在一起，默认是会自动换行的，但是利用display:inline;属性可以让两个表格并排在一起：
| 表格1 |
| 表格2 |
overflow: auto;
检索或设置当对象的内容超过其指定高度及宽度时如何管理内容。auto : 在需要时剪切内容并添加滚动条，例:
| 使用前的TextArea | 使用后的TextArea |
font:12px/18px;
字体大小/行高，例:
| 未使用CSS | 使用该CSS |
|
在这里行高是系统默认的，不会受影响的 |
这里的12px就表示字体大小，18px其实就等价于css中的line-height。 |
clip : rect ( 0 64 64 0 )
字体大小/行高，例:
原图：
裁减后：
可以利用这个来做动画:)
font-size:
expression(document.body.clientWidth / 20);
expression是IE浏览器特有的功能，可以直接执行脚本而算出css的值，例:
《CSS也能控制表格的交替颜色 》
对于支持HTML的BBS来说，这可能会是一个安全隐患！
position: absolute;
这个我想绝大多数人都知道——绝对定位，我所要说的是偶然发现的一个隐含功能，例:
当给一个网页元素的CSS设置为"position: absolute;"，那么它会绝对定位，然后根据css中的left,top属性确定自己的位置。但是如果我们仅仅设置一个元素样式表的"position: absolute;"属性，而不设置其left,top属性，那么该元素会浮在其html所在位置。看个例子，我将一个tr的CSS设置为"position: absolute;"：
| 第一行 |
| 第二行 |
第一行浮在第二行上了，这个特性可以很方便的来制作重叠效果，例如我以前写过的自定义按钮和flash播放器都用到了这个特性来实现重叠：
自定义按钮：一个自定义按钮，底下是一个普通的Button，利用"position:absolute;"在Button上面覆盖图片，这样看起来就像自定义按钮，而实际点击确是点击底下真实的Button（下载）
Flash播放器：这个播放器的进度条就是通过这种方法来重叠的。（下载）
打印 | 张贴于 2004-11-14 03:44:00 | Tag:Web技术
留言反馈
浏览器就快完成它的历世使命了，还在讨论兼容性，真是好玩。
误导误导。可笑可笑
刚刚解决了我一个问题，再一次感谢！
－－－－－
建议加精
爆了吗？
word-wrap :break-word;
所以非常支持，学到很多哦…………
对于
!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
还是没有用……有其他高招么？
对于 !!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!
还是没有办法……
有其它高招么？
对于 CSS 就更应该慎重，仅仅是 MS 的 IE 不同版本就会给你不同的效果。
css/xml/xhtml都是为了实现数据和表现的分离而产生的技术，很多人言必称mvc但是页面却从来没有真正的标准化设计过，不也是很讽刺么？至于有些人认为ms的css就是高级的，那就更加大谬了。技术上第三方浏览器实现ms的扩展很简单，但是那是对非标准行为的纵容。说起技术问题，ms到现在也没有实现w3c标准包含的很多细节，比如png的透明，还有ms的box不完全符合规范等等。
至少，你知道了CSS还能够这样用。必要的时候，你就会想起楼主的辛苦了。
虽然我也基本为了浏览器兼容性不用高级的CSS，但是。我是非常感谢楼主的！
这应该算不上什么兼容性问题吧。
而且上面的很多样式效果也比较实用，比如用户要打印页面上的一个表格式，肯定不希望打出来的表格线有粗有细.
比如 firefox ;P
浏览器里的 CSS 都是用来提高用户体验的吗？没想清楚就不要胡说。
有些css的灵活运用,是可以达到事半功倍的效果的!
大部分你说的技巧都是对客户体验提高不大，而且会造成浏览器兼容性降低的那种非标准元素
良好的客户体验绝对不是花里胡哨......
刚才用sharpreader看了一下,很多样式都不起作用了!
推荐大家对照看看“苏沈小雨”的css帮助文档！