DIV+CSS製作斜線效果記錄，divcss製作斜線

DIV+CSS製作斜線效果記錄，divcss製作斜線

DIV+CSS 斜線效果很簡單，只需設定一下CSS Border 的邊框就能有斜線效果。代碼分享給大家，你可以自己變通。

　　提示要注意兩點：1、DIV寬高的定義。2、DIV在 IE6 中預設是有高度的。

　　右邊是我們要實現的效果，代碼如下：

123456789101112

<div id="box"></div> <style type="text/css">#box{    width:0px; height:0px;    border:40px solid #000;    border-top-color:#930;    border-bottom-color:#0C3;    border-left-color:#FC0;    border-right-color:#009;}</style>

　　在FF IE7 IE8 都顯示正常，但在IE6中，卻如左邊所示，中間有差距，因此，需要加一行：

　　line-height:0px;

　　最終代碼如下：

123456789101112131415

<div id="box"></div> <style type="text/css">#box{     width:0px; height:0px;    border:40px solid #000;    border-top-color:#930;    border-bottom-color:#0C3;    border-left-color:#FC0;    border-right-color:#009;    line-height:0px;}</style></head>