分享CSS的八個小技巧

css有很多的功能，在這裡，小編給大家分享css中的八個小技巧。

1、相容所有瀏覽器顯示半透明效果的方法

<div class="transparent"></div>.transparent {    filter: progid:DXImageTransform.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屬性去掉就可以達到效果。

<div id="wrap">    <div class="column_left">        <h1>Float left</h1>    </div>    <div class="column_right">        <h1>Float right</h1>    </div></div>#wrap {    border: 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

<link type="text/css" rel="stylesheet" href="url" media="screen" charset="utf-8"><link type="text/css" rel="stylesheet" href="url" media="print" charset="utf-8">

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}

【相關推薦】

1. 精選：“php程式員工具箱”V0.1版本下載

2. 免費css線上視頻教程

3. php.cn獨孤九賤（2）－css視頻教程