css8个技巧,分享CSS的八个小技巧

css有很多的功能，在这里，小编给大家分享css中的八个小技巧。

1、兼容所有浏览器显示半透明效果的方法

.transparent {

filter: progid:DXImageTrans

for

m.Microsoft.Alpha(opacity=50);

-moz-opacity: 0.5;

-khtml-opacity: 0.5;

opacity: .5;

width

: 200px;

height

: 200px;

margin

: 0 auto;

background

: url("../img/pic.jpg");

}

2、_height,_width的作用

使用_height解决float的div不闭合的问题，可以将_height属性去掉就可以达到效果。

Float left

Float right

#wrap {

b

ord

er: 6px solid #ccc;

overflow

: auto;

_height: 1%;

}

.column_left {

width: 20%;

padding

: 10px;

float: left;

}

.column_right {

float: right;

width: 75%;

padding: 10px;

border-left: 6px solid #ccc;

}

3、使用min-height min-width解决div，或者span的固定高度问题

有时候我们需要设定某个元素固定高度，但是在firefox或者opera下面只设置高度，在内容不够多的时候，达不到预想的效果，这时候我们可以使用min-height

4、 使用media指令引入两种css：打印版本的css和屏幕显示的css

5、用.fixTable{ table-layout: fixed; overflow:hidden; }加上nobr标签实现隐藏

6、可以使用page-break-after，page-break-before控制打印时的分页

7、*html{}的作用是为了兼容6.0以下的IE版本，对html节点的选取，其他的浏览器都认为html标签是文档的根节点，而ie6以下的ie版本却认为在html标签的上面还有一个根节点

8、使用text-indent显示图片，而隐藏文字h1 { background: url(../img/pic.jpg) no-repeat; width: 200px; height: 200px; text-indent: -2000px}

【相关推荐】