[轉(zhuǎn)載]div投影-使用css實(shí)現(xiàn)
Posted on 2009-07-28 10:07 WANGPENG 閱讀(657) 評論(0) 編輯 收藏 所屬分類: 網(wǎng)摘 要對邊框外部進(jìn)行投影,使用濾鏡好像無法實(shí)現(xiàn),只能用多層位置偏差來實(shí)現(xiàn),具體css代碼如下:
1 <style>
2 .out {
3 position:relative;
4 background:#bbb;
5 margin:10px auto;
6 width:285px
7 }
8 .in {
9 background:#fff;
10 border:1px solid #555;
11 padding:10px 5px;
12 position:relative;
13 top:-5px;
14 left:-5px;
15 }
16 </style>
17 <div style="width:300px; margin-left:200px;">
18 <div class="out">
19 <div class="in" >
20 this is div content!
21 </div>
22 </div>
23 </div>
24
2 .out {
3 position:relative;
4 background:#bbb;
5 margin:10px auto;
6 width:285px
7 }
8 .in {
9 background:#fff;
10 border:1px solid #555;
11 padding:10px 5px;
12 position:relative;
13 top:-5px;
14 left:-5px;
15 }
16 </style>
17 <div style="width:300px; margin-left:200px;">
18 <div class="out">
19 <div class="in" >
20 this is div content!
21 </div>
22 </div>
23 </div>
24