html圆形修饰,HTML修饰效果集锦（演示与代码）

1.单线框

src="http://storage.live.com/items/253B060D23B8AC9E!1733?filename=%E8%82%96%E5%83%8F5.jpg"

style="border:3 solid

#ff0000">

2.双线框

src="http://storage.live.com/items/253B060D23B8AC9E!1742?filename=%E8%82%96%E5%83%8F2.jpg"

style="border:5 double

green">

3.凸出框

src="http://storage.live.com/items/F440B48EC423F004!451?filename=1321869.gif"

style="border:25 outset

#ff88ff">

4.凹进框

src="http://storage.live.com/items/F440B48EC423F004!454?filename=1326120.gif"

style="border:25 inset

#ff88ff">

5.邮票框

bgcolor="#f6ae56">

bgcolor="#aeffae" width=600 height=200 align=center

valign=middle>

src="http://storage.live.com/items/F440B48EC423F004!455?filename=1342821.jpg">

6.虚线框

src="http://storage.live.com/items/F440B48EC423F004!457?filename=1565303.jpg"

style="border:4 dashed

#ff0000">

7.凹槽框

src="http://storage.live.com/items/F440B48EC423F004!447?filename=1308438.jpg"

style="border:25 groove green"

border="0">

8.脊状框

src="http://storage.live.com/items/F440B48EC423F004!452?filename=1321893.jpg"

style="border:25 ridge green"

border="0">

9.立体阴影框

cellpadding="15" cellspacing="3"

style="filter:progid:DXImageTransform.Microsoft.Shadow(color:#f6ae56,direction:145,strength:15)">

bgcolor="#ffffff" align=center valign=middle>

src="http://storage.live.com/items/F440B48EC423F004!448?filename=1320096.jpg">

10.阴影框

src="http://storage.live.com/items/F440B48EC423F004!449?filename=1320101.jpg"

style="filter:shadow(color=#32cd32)">

11.横向渐变透明

src="http://storage.live.com/items/F440B48EC423F004!458?filename=%E7%BD%91%E9%A1%B5%E8%83%8C%E6%99%AF%E5%9B%BE3.jpg"

style="filter=alpha(opacity=100,style=1,finishopacity=0)">

12。圆形渐变透明

src="http://storage.live.com/items/253B060D23B8AC9E!1747?filename=%E5%8D%A1%E9%80%9A%E6%A2%A6%E5%B9%BB%20(7).jpg"

style="filter=alpha(opacity=100,style=2,finishopacity=0)">

13.X形渐变透明

src="http://storage.live.com/items/253B060D23B8AC9E!1705?filename=20061113172552.jpg"

style="filter=alpha(opacity=100,style=3,finishopacity=0)">

14。改变某种颜色

src="http://storage.live.com/items/253B060D23B8AC9E!1705?filename=20061113172552.jpg"style="FILTER:

Chroma(Color=#13629f)">

15.黑白效果

src="http://storage.live.com/items/253B060D23B8AC9E!1705?filename=20061113172552.jpg"

style="filter:'gray'">

16.X光效果(底片)

src="http://storage.live.com/items/253B060D23B8AC9E!1723?filename=UF2006429233.jpg"

style="filter:'xray'">

17.浮雕效果

src="http://storage.live.com/items/253B060D23B8AC9E!1742?filename=%E8%82%96%E5%83%8F2.jpg"

style="filter:progid:DXImageTransform.Microsoft.Emboss()">

18.上下颠倒

src="http://storage.live.com/items/253B060D23B8AC9E!1742?filename=%E8%82%96%E5%83%8F2.jpg"

style="filter:flipv">

19.左右颠倒

20.色彩颠倒

src="http://storage.live.com/items/253B060D23B8AC9E!1708?filename=20061113172824.jpg"

style="filter:invert">

21.粒状阴影

src="http://storage.live.com/items/253B060D23B8AC9E!1742?filename=%E8%82%96%E5%83%8F2.jpg"

style="filter:progid:DXImageTransform.Microsoft.Glow(color=#cc8888,strength=30)">

22.模糊效果

src="http://storage.live.com/items/253B060D23B8AC9E!1736?filename=%E8%82%96%E5%83%8F8.jpg"

style="filter:progid:DXImageTransform.Microsoft.Blur(PixelRadius=10)">

23.水波效果(风吹)

src="http://storage.live.com/items/F440B48EC423F004!452?filename=1321893.jpg"

style="filter:wave(freq=11, strength=4, phase=6,

lightstrength=10)">

其中17.浮雕效果 21.粒状阴影22.模糊效果

这三种修饰在博客中只能预览而不能发表。

转发至微博

转发至微博