【网页制作】边框7种特效（附代码）

adminn

边框特效是给图片加一个相框，一是增加美感，起到衬托的作用，二是分界图片与页面主体界线分明（多用于浮窗效果，本站广告窗就是采用这种方式）

相框的类型：相框的类型有如下几种，附页面html代码
网页制作之简单线框
<IMG style="BORDER-RIGHT: #ffcccc 5px solid; BORDER-TOP: #ffcccc 5px solid; BORDER-LEFT: #ffcccc 5px solid; BORDER-BOTTOM: #ffcccc 5px solid" src=""width="" height="">

网页制作之双线框
<IMG style="BORDER-RIGHT: 7px double; BORDER-TOP: 7px double; BORDER-LEFT: 7px double; BORDER-BOTTOM: 7px double" src=""width="" height="">

网页制作之虚线框
<IMG style="BORDER-RIGHT: #990000 3px dashed; BORDER-TOP: #990000 3px dashed; BORDER-LEFT: #990000 3px dashed; BORDER-BOTTOM: #990000 3px dashed" src=""width="" height="">

网页制作之凸出框 　
<IMG style="BORDER-RIGHT: #ccccff 10px outset; BORDER-TOP: #ccccff 10px outset; BORDER-LEFT: #ccccff 10px outset; BORDER-BOTTOM: #ccccff 10px outset"src=""width="" height="">

网页制作之嵌入框
<IMG style="BORDER-RIGHT: #ff9900 15px inset; BORDER-TOP: #ff9900 15px inset; BORDER-LEFT: #ff9900 15px inset; BORDER-BOTTOM: #ff9900 15px inset"src=""width="" height="">

网页制作之脊状框　　
<IMG style="BORDER-RIGHT: #33ff66 15px ridge; BORDER-TOP: #33ff66 15px ridge; BORDER-LEFT: #33ff66 15px ridge; BORDER-BOTTOM: #33ff66 15px ridge"src=""width="" height="">

网页制作之凹槽框 　
<IMG style="BORDER-RIGHT: #cc6666 15px groove; BORDER-TOP: #cc6666 15px groove; BORDER-LEFT: #cc6666 15px groove; BORDER-BOTTOM: #cc6666 15px groove"src=""width="" height="">

本文撰稿：汇三汇阀泵【汇三汇.中国】
转载请保留链接，发布转载帖子可以获得收益。
Please keep the link for reprinting, and you can get benefits from publishing reprinted posts.