非常好的边框样式设置工具,使用该工具您可以很方便的为DIV设置简单的边框样式，如果放在DW中会更好。
会制作DW插件的高手，请帮忙制作成DW插件：
截图：
运行代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <!-- ┌─────『恋婷娱乐秀』────────┐ │最愛丁香花 Vickey Chen QQ:106456213 │ │版权所有: 琳儿工作室(www.nihaoku.cn) │ │QQ空 间: http://106456213.qzone.qq.com │ │E-Mail:vickeychen@126.com │ └───────.NET(WEB2.0)───────┘ --> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>JS轻松实现设置div边框样式 - 中国asp之家</title> <style> *{font-size:12px;} #vcssdivBoderMidlayout,#vcssdivBoderLeftlayout,#vcssdivBoderRightlayout{float:left;} #vcssdivBoderMidlayout ul{list-style-type:none;margin:0;} #vcssdivBoderMidlayout li{width:100px;text-align:center} #vcssdivBoderMidlayout input{width:20px;height:20px;border:1px solid #ccc;background-color:#FFFFFF;margin:2px;} #vcssdivBoderRightlayout input{width:50px;height:50px;background-color:#FFFFFF;border:0;} </style> <script> var sInitColor = null; function callColorDlg(obj){ if (sInitColor == null) var sColor = dlgHelper.ChooseColorDlg(); else var sColor = dlgHelper.ChooseColorDlg(sInitColor); sColor = sColor.toString(16); if (sColor.length < 6) { var sTempString = "000000".substring(0,6-sColor.length); sColor = sTempString.concat(sColor); } if(sColor!="000000"){ sColor = "#" + sColor; if(obj.tagName=='INPUT')obj.value=sColor; obj.style.backgroundColor=sColor; } } </script> </head> <body> <OBJECT id="dlgHelper" CLASSID="clsid:3050f819-98b5-11cf-bb82-00aa00bdce0b" width="0px" height="0px"></OBJECT> <div style="width:100%"> <div class="vcssdivBorder" id="vcssdivBorder"> <div id="vcssdivBoderLeftlayout"> 连线色:<input name="vcssdivBorderColor" onClick="callColorDlg(this);" id="vcssdivBorderColor" value="#ff0000" onfocus="setSelectBorderStyle(vcssdivBorderPreview);" onblur="setSelectBorderStyle(vcssdivBorderPreview);" onpropertychanges="setSelectBorderStyle(vcssdivBorderPreview);" /> <br /> 宽 度:<input name="vcssdivBorderWidth" id="vcssdivBorderWidth" value="1px" /> <br /> 样 式: <select name="vcssdivBorderStyle" id=""> <option value="solid" selected>solid</option> <option value="dotted">dotted</option> <option value="none">none</option> </select> </div> <div id="vcssdivBoderMidlayout"> <ul> <li><input type="checkbox" checked="checked" onClick="unsetSelectBorderStyle(this,'borderTop')" value=" " name="vcssdivBorderTop" style="border-top:1px solid #cc7700;" /> <input type="checkbox" checked="checked" onClick="unsetSelectBorderStyle(this,'borderBottom')" value=" " name="vcssdivBorderBottom" style="border-bottom:1px solid #cc7700;" /></li> <li><input type="checkbox" onClick="unsetSelectBorderStyle(this,'border')" value=" " name="vcssdivBorderAll" style="border:1px solid #cc7700;" /></li> <li><input type="checkbox" checked="checked" onClick="unsetSelectBorderStyle(this,'borderLeft')" value=" " name="vcssdivBorderLeft" style="border-left:1px solid #cc7700;" /> <input type="checkbox" checked="checked" onClick="unsetSelectBorderStyle(this,'borderRight')" value=" " name="vcssdivBorderRight" style="border-right:1px solid #cc7700;" /></li> </ul> </div> <div id="vcssdivBoderRightlayout"> 效果如下:<br /><input type="button" value=" " id="vcssdivBorderPreview" name="vcssdivBorderPreview" onClick="document.getElementById('divcode').innerHTML=this.style.cssText" /> </div> </div> </div> <p> <input type="button" value="设置" onClick="document.getElementById('new_div').style.cssText=document.getElementById('vcssdivBorderPreview').style.cssText;document.getElementById('divcode').innerHTML=vcssdivBorderPreview.style.cssText" /> </p> <div id="new_div"> 点击"设置"，为我添加边框 </div> css代码如下： <div id="divcode"></div> <script> function setSelectBorderStyle(obj) { obj.style.border=document.getElementById('vcssdivBorderWidth').value+" "+document.getElementById('vcssdivBorderStyle').value+" "+document.getElementById('vcssdivBorderColor').value; } function unsetSelectBorderStyle(obj,css) { if(!obj.checked) { eval("vcssdivBorderPreview.style."+css+"='0'"); } else { eval("vcssdivBorderPreview.style."+css+"='"+document.getElementById('vcssdivBorderWidth').value+" "+document.getElementById('vcssdivBorderStyle').value+" "+document.getElementById('vcssdivBorderColor').value+"'"); } } </script> </body> </html> [提示：你可先修改部分代码，再按运行]
请稍等，评论加载中...