国产探花免费观看_亚洲丰满少妇自慰呻吟_97日韩有码在线_资源在线日韩欧美_一区二区精品毛片,辰东完美世界有声小说,欢乐颂第一季,yy玄幻小说排行榜完本

首頁 > 學院 > 開發設計 > 正文

DIV+CSS制作斜線效果記錄

2019-11-14 16:49:12
字體:
來源:轉載
供稿:網友

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

  提示要注意兩點:1、DIV寬高的定義。2、DIV在 IE6 中默認是有高度的。

  上圖右邊是我們要實現的效果,代碼如下:

1
2
3
4
5
6
7
8
9
10
11
12
<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;

  最終代碼如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
<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>

發表評論 共有條評論
用戶名: 密碼:
驗證碼: 匿名發表
主站蜘蛛池模板: 门源| 祁门县| 长子县| 塔城市| 杭锦后旗| 昌江| 定边县| 武鸣县| 陇川县| 鄯善县| 湾仔区| 凤山县| 涪陵区| 贡嘎县| 沙坪坝区| 财经| 定西市| 盖州市| 五大连池市| 德格县| 志丹县| 麻栗坡县| 东乡族自治县| 通河县| 西充县| 布尔津县| 三台县| 大渡口区| 江达县| 隆昌县| 隆回县| 三门峡市| 桐梓县| 上高县| 闸北区| 囊谦县| 疏附县| 韶关市| 四川省| 重庆市| 重庆市|