HTML网页中放置图片语法

2014-10-18 20:39:55 -0400
一、基础代码<IMG src="图片链接地址" width=200>
二、加边框1、普通黑色边框(浏览器默认黑色)
<img src="图片链接地址" width=200 border=12>2、简单的CSS装饰框①<img src="图片链接地址" width=200 style="border:12px #987cb9 solid">②<img src="图片链接地址" width=200 style="border:12px #987cb9 dashed">③<img src="图片链接地址" width=200 style="border:12px #987cb9 dotted">④<img src="图片链接地址" width=200 style="border:12px #987cb9 double">⑤<img src="图片链接地址" width=200 style="border:12px #987cb9 groove">⑥<img src="图片链接地址" width=200 style="border:12px #987cb9 ridge">⑦<img src="图片链接地址" width=200 style="border:12px #987cb9 inset">⑧<img src="图片链接地址" width=200 style="border:12px #987cb9 outset">三、加CSS滤镜1、无参数滤镜①黑白<IMG style="FILTER: gray()" src="图片链接地址" width=200>②底片<IMG style="FILTER: xray()" src="图片链接地址" width=200>③X光片<IMG style="FILTER: invert()" src="图片链接地址" width=200>④水平翻转<IMG style="FILTER: fliph()" src="图片链接地址" width=200>⑤垂直翻转<IMG style="FILTER: flipv()" src="图片链接地址" width=200>2、透明效果(opacity=100 透明度0—100)①<IMG style="FILTER: Alpha(opacity=100,style=1)" src="图片链接地址" width=200>②<IMG style="FILTER: Alpha(opacity=100,style=2)" src="图片链接地址" width=200>③<IMG style="FILTER: Alpha(opacity=100,style=3)" src="图片链接地址" width=200>④<IMG style="FILTER: Alpha(opacity=0,finishopacity=100,style=1)" src="图片链接地址" width=200>3、其他特效①浮雕<IMG style="FILTER:progid:DXImageTransform.Microsoft.Emboss()" src="图片链接地址" width=200> ②波纹<IMG style="FILTER:progid:DXImageTransform.Microsoft.Wave()" src="图片链接地址" width=200><IMG style="FILTER:Wave(Add=0,Freq=5,LightStrength=10,Phase=2,Strength=20)" src="图片链接地址" width=200>(Add=是否打乱1或0;Freq=频率;LightStrength=光效强度;Phase=偏移量;Strength=振幅)③模糊<IMG style="FILTER:progid:DXImageTransform.Microsoft.Blur()" src="图片链接地址" width=200><IMG style="FILTER:Blur(Add=1,Direction=45,Strength=150)" src="图片链接地址" width=200>(Add=是否模糊1或0;Direction=方向;Strength=强度)④发光<IMG style="FILTER:progid:DXImageTransform.Microsoft.Glow()" src="图片链接地址" width=200><IMG style="FILTER:progid:DXImageTransform.Microsoft.Glow(Color=#987cb9,Strength=10)" src="图片链接地址" width=200>(Color=颜色;Strength=强度)⑤阴影<IMG style="FILTER:progid:DXImageTransform.Microsoft.Shadow()" src="图片链接地址" width=200><IMG style="FILTER:progid:DXImageTransform.Microsoft.Shadow(Color=#987cb9,Direction=135,Strength=10)" src="图片链接地址" width=200>(Color=颜色;Direction=方向;Strength=强度)⑥投影<IMG style="FILTER:progid:DXImageTransform.Microsoft.DropShadow()" src="图片链接地址" width=200><IMG style="FILTER:progid:DXImageTransform.Microsoft.DropShadow(Color=#987cb9,Offx=10,Offy=5,Positive=1)" src="图片链接地址" width=200>(Color=颜色;offx=横向位移;offy=纵向位移;Positive=非透明或透明像素建立可见投影1或0)镂空<IMG style="FILTER: Mask()" src="图片链接地址">四、图片定位(align=right图片居右 hspace水平间距 vspace垂直间距)<img src="图片链接地址" width=200 align=right hspace="5" vspace="5">五、添加图片说明<img src="图片链接地址" width=200 alt="原来你也在这里">提问者评价 乱
参考资料: http://qingxing530.bokee.com/viewdiary.13095301.html
«Newer      Older»

----Comments(2)----
怒放家族de霖 (@wxf) | @ at 2014-11-12 02:09:
收藏
戒网Loadin (@lll111) | @ at 2014-10-29 09:31:
拿走了

Back to home

Subscribe | Register | Login | N