资料
表格
制度
合同
管理
职场
经营
创业
范文
总结
计划
作文
文章
美文
词句
教程
模板
图片
字体
图标
办公
人事
财务
生产
管理资源吧首页
>>>
教程
>>>
编程
>>>
CSS/HTML教程
>>>
用js实现的DIV+CSS编辑器代码
<!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"> <head> <title>DIV+CSS编辑器</title> <META http-equiv=Content-Type content="text/html; charset=gb2312"> <meta content="all" name="robots" /> <meta name="description" content="DIV+CSS编辑器是一个在线编辑DIV+CSS的在线编辑工具" /> <meta content="DIV+CSS编辑器,在线编辑,DIV+CSS,DIV+CSS工具,在线工具" name="keywords" /> <style type="text/css" media="screen"> <!-- html,body{height:100%;}*{font-size:12px;}.vcsseffect{background-color:#fff;background-image:url(grid.gif);}.hiddenObj{display:none;}.normal_input{border:1px solid #84a1bd;background-color:#fff;height:18px;}.hover_input {border:1px solid #9ecc00;background-color:#fff;height:18px;}.vcssDetail{padding: 15px;padding-top:0px;}.MainDialogCSS{ width:550px; margin-right: auto; margin-left: auto; }.DetailCSSboxModel{ height:100%; margin-right: auto; margin-left: auto; }.MainBody{ height:400px; width: 760px; margin-left: auto; margin-right: auto; } --> </style> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%20language%3D%22javascript%22%20type%3D%22text%2Fjavascript%22%3E%20%0D%0A%3C!--%20%0D%0Afunction%20hoverInput(obj%2Cn)%20%0D%0A%7B%20%0D%0A%20%20%20%20if(n%3D%3D1)%7Bif(obj.tagName%3D%3D%22INPUT%22%20%26%26%20obj.type%3D%3D%22text%22)%7Bobj.className%3D'hover_input'%3B%7D%7D%20%0D%0A%20%20%20%20else%7B%20%0D%0A%20%20%20%20%20%20%20%20if(obj.tagName%3D%3D%22INPUT%22%20%26%26%20obj.type%3D%3D%22text%22)%20%0D%0A%20%20%20%20%20%20%20%20%7B%20%0D%0A%20%20%20%20%20%20%20%20obj.className%3D'normal_input'%3B%20%0D%0A%20%20%20%20%20%20%20%20if(obj.value!%3D''%20%26%26%20!isNaN(obj.value.substring(obj.value.length-1)))obj.value%2B%3D'px'%3B%20%0D%0A%20%20%20%20%20%20%20%20%7D%20%0D%0A%20%20%20%20%7D%20%0D%0A%20%20%20%20setSelectionWithCss(2)%3B%20%0D%0A%7D%20%0D%0Avar%20allCSSsetterCode%20%3D%20%22%22%3B%20%0D%0Afunction%20setSelectionWithCss(funnum)%20%0D%0A%7B%20%0D%0A%20%20%20%20isSetting(vcssWidth%2C%22width%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssHeight%2C%22height%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssBackgroundColor%2C%22background-color%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssColor%2C%22color%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssBorderWidth%2C%22border-width%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssBorderColor%2C%22border-color%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssBorderdStyle%2C%22border-style%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssMargin%2C%22margin%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssPadding%2C%22padding%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssFloatResult%2C%22float%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssDisplay%2C%22display%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssVisibilityResult%2C%22visibility%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssTextAlign%2C%22text-align%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssLineHeight%2C%22line-height%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssTextIndent%2C%22text-indent%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssFontSize%2C%22font-Size%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssFontFamily%2C%22font-family%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssFontWeight%2C%22font-weight%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssDecorationResult%2C%22text-decoration%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssPosition%2C%22position%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssZIndex%2C%22z-index%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssLeft%2C%22left%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssRight%2C%22right%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssTop%2C%22top%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssBottom%2C%22bottom%22)%3B%20%20%20%20%20%0D%0A%20%20%20%20isSetting(vcssPositionResult%2C%22list-style-position%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssCursor%2C%22cursor%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssBackgroundRepeat%2C%22background-repeat%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssBackgroundAttachment%2C%22background-attachment%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssListStyleType%2C%22list-style-type%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssOverflow%2C%22overflow%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssClear%2C%22clear%22)%3B%20%0D%0A%20%20%20%20isSetting(vcssVerticalAlign%2C%22vertical-align%22)%3B%20%0D%0A%20%20%20%20if(vcssBackgroundImage.value!%3D%22%22)allCSSsetterCode%2B%3D%22background-image%3Aurl(%22%2BvcssBackgroundImage.value%2B%22)%3B%22%3B%20%0D%0A%20%20%20%20if(vcssBackgroundPositionX.value!%3D%22%22%20%26%26%20vcssBackgroundPositionY.value!%3D%22%22)allCSSsetterCode%2B%3D%22background-position%3A%22%2BvcssBackgroundPositionX.value%2B%22%20%22%2BvcssBackgroundPositionY.value%2B%22%3B%22%3B%20%0D%0A%20%20%20%20if(vcssListStyleImage.value!%3D%22%22)allCSSsetterCode%2B%3D%22list-style-image%3Aurl(%22%2BvcssListStyleImage.value%2B%22)%3B%22%3B%20%0D%0A%20%20%20%20if(funnum%3D%3D1)%20%0D%0A%20%20%20%20%7B%20%0D%0A%20%20%20%20%20%20%20%20alert(allCSSsetterCode)%3B%20%0D%0A%20%20%20%20%7D%20%0D%0A%20%20%20%20else%20%0D%0A%20%20%20%20%7B%20%0D%0A%20%20%20%20%20%20%20%20var%20everyRule%20%3D%20allCSSsetterCode.split('%3B')%3B%20%0D%0A%20%20%20%20%20%20%20%20var%20resultCSSTEXT%3DvcssIdentName.value%2B%22%5Cr%5Cn%7B%5Ct%22%3B%20%0D%0A%20%20%20%20%20%20%20%20for(var%20v%3D0%3Bv%3CeveryRule.length-1%3Bv%2B%2B)%20%0D%0A%20%20%20%20%20%20%20%20%7B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20resultCSSTEXT%2B%3DeveryRule%5Bv%5D%2B%22%3B%5Cr%5Cn%5Ct%22%3B%20%0D%0A%20%20%20%20%20%20%20%20%7D%20%0D%0A%20%20%20%20%20%20%20%20resultCSSTEXT%2B%3D%22%5Cr%5Cn%7D%22%3B%20%0D%0A%20%20%20%20%20%20%20%20document.all.cssTextValue.value%3DString(resultCSSTEXT)%3B%20%0D%0A%20%20%20%20%20%20%20%20document.all.cssTextValueCompare.value%3DString(allCSSsetterCode)%3B%20%0D%0A%20%20%20%20%20%20%20%20vcsseffect_div.style.cssText%3DString(allCSSsetterCode)%3B%20%0D%0A%20%20%20%20%7D%20%0D%0A%20%20%20%20allCSSsetterCode%3D%22%22%3B%20%0D%0A%7D%20%0D%0Avar%20isFisrtGetCss%20%3D%20true%3B%20%0D%0Afunction%20getSelectionWithCss(funnum)%20%0D%0A%7B%20%0D%0A%20%20%20%20isGetting(%22vcssWidth%22%2C%22width%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssHeight%22%2C%22height%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssBackgroundColor%22%2C%22backgroundColor%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssColor%22%2C%22color%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssBorderWidth%22%2C%22borderWidth%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssBorderColor%22%2C%22borderColor%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssBorderdStyle%22%2C%22borderStyle%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssMargin%22%2C%22margin%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssPadding%22%2C%22padding%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssFloat%22%2C%22float%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssDisplay%22%2C%22display%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssVisibilityResult%22%2C%22visibility%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssTextAlign%22%2C%22textAlign%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssLineHeight%22%2C%22lineHeight%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssTextIndent%22%2C%22textIndent%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssFontSize%22%2C%22fontSize%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssFontFamily%22%2C%22fontFamily%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssFontWeight%22%2C%22fontWeight%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssDecorationResult%22%2C%22textDecoration%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssBackgroundImage%22%2C%22backgroundImage%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssBackgroundRepeat%22%2C%22backgroundRepeat%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssBackgroundAttachment%22%2C%22backgroundAttachment%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssListStyleType%22%2C%22listStyleType%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssListStyleImage%22%2C%22ListStyleImage%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssPositionResult%22%2C%22listStylePosition%22)%3B%20%0D%0A%20%20%20%20isGetting(%22vcssCursor%22%2C%22cursor%22)%3B%20%0D%0A%7D%20%0D%0Afunction%20isSetting(cssobj%2CcssStartParam)%20%0D%0A%7B%20%0D%0A%20%20%20%20if(cssobj.value!%3D%22%22)allCSSsetterCode%2B%3DcssStartParam%2B%22%3A%22%2Bcssobj.value%2B%22%3B%22%3B%20%0D%0A%7D%20%0D%0Afunction%20isGetting(cssobj%2CcssStartParam)%20%0D%0A%7B%20%20%20%20if(isFisrtGetCss)%20%0D%0A%20%20%20%20%7B%20%0D%0A%20%20%20%20%20%20%20%20ele%20%3D%20document.getElementById(%22vv%22)%3B%20%0D%0A%20%20%20%20%20%20%20%20if(eval(%22ele.style.%22%2BcssStartParam)!%3D%22%22)%20%0D%0A%20%20%20%20%20%20%20%20%7B%20%0D%0A%20%20%20%20%20%20%20%20%20%20%20%20document.all%5Bcssobj%5D.value%3Deval(%22ele.style.%22%2BcssStartParam)%3B%20%0D%0A%20%20%20%20%20%20%20%20%7D%20%0D%0A%20%20%20%20%7D%20%0D%0A%7D%20%0D%0A%2F%2F--%3E%20%0D%0A%3C%2Fscript%3E"> <img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__script" _ewebeditor_fake_tag="script" _ewebeditor_fake_value="%3Cscript%3E%20%0D%0Avar%20sInitColor%20%3D%20null%3B%20%0D%0Afunction%20callColorDlg(obj)%7B%20%0D%0Aif%20(sInitColor%20%3D%3D%20null)%20%20%0D%0A%20%20%20%20var%20sColor%20%3D%20dlgHelper.ChooseColorDlg()%3B%20%0D%0Aelse%20%0D%0A%20%20%20%20var%20sColor%20%3D%20dlgHelper.ChooseColorDlg(sInitColor)%3B%20%0D%0A%20%20%20%20%20%20%20%20sColor%20%3D%20sColor.toString(16)%3B%20%20%20%20%20%0D%0Aif%20(sColor.length%20%3C%206)%20%7B%20%0D%0A%20%20var%20sTempString%20%3D%20%22000000%22.substring(0%2C6-sColor.length)%3B%20%0D%0A%20%20sColor%20%3D%20sTempString.concat(sColor)%3B%20%0D%0A%7D%20%0D%0Aif(sColor!%3D%22000000%22)%7B%20%0D%0AsColor%20%3D%20%22%23%22%20%2B%20sColor%3B%20%0D%0Aobj.value%3DsColor%3B%20%0D%0Aobj.style.backgroundColor%3DsColor%3B%20%0D%0A%7D%7D%20%0D%0A%3C%2Fscript%3E"></head><img src="/_New/_cj/myeditor/sysimage/space.gif" class="ewebeditor__unknownobject" _ewebeditor_fake_tag="unknownobject" _ewebeditor_fake_value="%3COBJECT%20id%3DdlgHelper%20CLASSID%3D%22clsid%3A3050f819-98b5-11cf-bb82-00aa00bdce0b%22%20width%3D%220px%22%20height%3D%220px%22%3E%3C%2FOBJECT%3E" width="0px" height="0px"> <body> <p align="center"> <font style="color:#FF0000; font-size:14px; font-weight:bolder"> 在线DIV+CSS编辑器 </font> </p> <div class="MainBody" id="MainBody"> <div onMouseOver="hoverInput(event.srcElement,1);" onMouseOut="hoverInput(event.srcElement,2);" onKeyUp="setSelectionWithCss(2);" class="MainDialogCSS"> <div id="vcssDetail_div" class="vcssDetail" style="display:block;"><p> 类/标签/ID:<input name="vcssIdentName" id="vcssIdentName" value=".style1" class="normal_input" onmouseover="select();" onMouseOut="event.cancelBubble=true;this.className='normal_input';" /> 所有数值都不用输入单位; 宽:<input name="vcssWidth" type="text" class="normal_input" id="vcssWidth" value="" size="8" /> 高:<input name="vcssHeight" type="text" class="normal_input" id="vcssHeight" value="" size="8" /> 背景色:<input name="vcssBackgroundColor" type="text" class="normal_input" id="vcssBackgroundColor" onMouseOut="event.cancelBubble=true;this.className='normal_input';" value="" size="8" onClick="callColorDlg(this)" /> 前景色:<input name="vcssColor" type="text" class="normal_input" id="vcssColor" value="" size="8" onMouseOut="event.cancelBubble=true;this.className='normal_input';" onClick="callColorDlg(this)" /> 边框:<input name="vcssBorderWidth" onclick="value=1;vcssBorderdStyle.value='solid';" type="text" class="normal_input" id="vcssBorderWidth" value="" size="8" /> 颜色:<input name="vcssBorderColor" type="text" class="normal_input" id="vcssBorderColor" value="" size="8" onClick="callColorDlg(this)" onMouseOut="event.cancelBubble=true;this.className='normal_input';" /> <select name="vcssBorderdStyle" id="vcssBorderdStyle" onclick="if(value=='')value='solid';"> <option selected>选择<option value="solid">solid<option value="dotted">dotted<option value="none">none<option value="hidden">hidden<option value="dashed">dashed<option value="double">double<option value="groove">groove<option value="ridge">ridge<option value="inset">inset<option value="outset">outset</select> 外间距 Margin :<input name="vcssMargin" type="text" onKeyDown="if(event.keyCode==32)this.value+='px';" class="normal_input" id="vcssMargin" value="" size="20" /> 如:10px 2px 内间距 Padding:<input name="vcssPadding" type="text" onKeyDown="if(event.keyCode==32)this.value+='px';" onBlur="if(this.value!='' && !isNaN(this.value.substring(this.value.length-1)))this.value+='px';" class="normal_input" id="vcssPadding" value="" size="20" /> 如:10px 2px 浮动: 左<input type="radio" name="vcssFloat" onClick="if(this.checked)vcssFloatResult.value=this.value" value="left"> 右<input name="vcssFloat" type="radio" onClick="if(this.checked)vcssFloatResult.value=this.value" value="right"><input name="vcssFloat" type="radio" class="hiddenObj" id="unsetFloat" onClick="if(this.checked)vcssFloatResult.value='';" /> <a onClick="unsetFloat.click();" style="cursor:pointer;" title="取消浮动属性">×</a> <input name="vcssFloatResult" type="hidden" /> 显示:<select name="vcssDisplay" id="vcssDisplay"> <option selected>选择 <option value="block">block <option value="inline">inline <option value="none">none </select> 可见:<input type="radio" name="vcssVisibility" value="visible" onClick="if(this.checked)vcssVisibilityResult.value=this.value">可见 <input type="radio" name="vcssVisibility" value="hidden" onClick="if(this.checked)vcssVisibilityResult.value=this.value">隐藏 <input type="radio" name="vcssVisibility" class="hiddenObj" id="unsetVisibility" onClick="if(this.checked)vcssVisibilityResult.value='';" /><a onClick="unsetVisibility.click();" style="cursor:pointer;" title="取消可见属性">×</a> <input name="vcssVisibilityResult" type="hidden" /> 文本对齐:<select name="vcssTextAlign" id="vcssTextAlign" onclick="if(value=='')value='center';"> <option selected>选择</option> <option value="left">left</option> <option value="center">center</option> <option value="right">right</option> </select> 行高:<input name="vcssLineHeight" type="text" class="normal_input" id="vcssLineHeight" onMouseOut="event.cancelBubble=true;this.className='normal_input';" value="" size="8" /> <select name="vcssLineUnit" id="select5"> <option value="%">%</option> <option selected>无</option> <option value="px">px</option> </select> 文字缩进:<input name="vcssTextIndent" type="text" class="normal_input" id="vcssLineHeight4" value="" size="8" /> 文本:<input name="vcssFontSize" type="text" class="normal_input" id="vcssFontSize" value="12px" size="5" /> 字体: <select name="vcssFontFamily" id="vcssFontFamily" onclick="if(value=='')value='Arial';"><option selected>选择</option><option value="宋体">宋体<option value="黑体">黑体<option value="Arial">Arial<option value="微软雅黑">雅黑</select> 粗细:<input name="vcssFontWeight" type="text" class="normal_input" id="vcssLineHeight3" value="" size="8" onMouseOut="event.cancelBubble=true;this.className='normal_input';" /> 效果:<input type="radio" name="vcssTextDecoration" value="underline" onClick="if(this.checked)vcssDecorationResult.value=this.value">下划线 <input type="radio" name="vcssTextDecoration" value="none" onClick="if(this.checked)vcssDecorationResult.value=this.value">无 <input type="radio" name="vcssVisibility" class="hiddenObj" id="unsetDecoration" onClick="if(this.checked)vcssDecorationResult.value='';" /><a onClick="unsetDecoration.click();" style="cursor:pointer;" title="取消文字效果属性">×</a> <input name="vcssDecorationResult" type="hidden" /> 背景图片:<input name="vcssBackgroundImage" type="file" class="normal_input" id="vcssBackgroundImage"> 重复:<select name="vcssBackgroundRepeat" id="vcssBackgroundRepeat" onclick="if(value=='')value='no-repeat';"><option selected>选择<option value="repeat-x">横向重复<option value="repeat-y">纵向重复<option value="no-repeat">不重复</select> 水平位置:<input name="vcssBackgroundPositionX" type="text" class="normal_input" id="vcssBackgroundPositionX" value="" size="5" /> 垂直位置:<input name="vcssBackgroundPositionY" type="text" class="normal_input" id="vcssBackgroundPositionY" value="" size="5" /> 附件:<select name="vcssBackgroundAttachment" id="vcssBackgroundAttachment" onclick="if(value=='')value='fixed';"><option selected>选择<option value="fixed">固定<option value="scroll">滚动</select> 垂直对齐:<select name="vcssVerticalAlign" id="vcssVerticalAlign" onclick="if(value=='')value='middle';"> <option selected>选择</option> <option value="middle">middle</option> <option value="bottom">bottom</option> <option value="auto">top</option> <option value="auto">auto</option> <option value="baseline">baseline</option> </select> 清除:<select name="vcssClear" id="vcssClear" onclick="if(value=='')value='both';"> <option selected>选择</option> <option value="left">left</option> <option value="right">right</option> <option value="both">both</option> </select> Overflow:<select name="vcssOverflow" id="vcssOverflow" onclick="if(value=='')value='hidden';"> <option selected>选择</option> <option value="scroll">scroll</option> <option value="auto">auto</option> <option value="hidden">hidden</option> </select> 定位:<select name="vcssPosition" id="vcssPosition"> <option selected>选择</option> <option value="absolute">绝对</option> <option value="relative">相对</option> </select> Z坐标:<input name="vcssZIndex" id="vcssZIndex" class="normal_input" size="5" value="" onMouseOut="event.cancelBubble=true;this.className='normal_input';" /> left:<input name="vcssLeft" id="vcssLeft" class="normal_input" size="4" value="" /> top:<input name="vcssTop" id="vcssTop" class="normal_input" size="4" /> right:<input name="vcssRight" id="vcssRight" class="normal_input" size="4" /> bottom:<input name="vcssBottom" id="vcssBottom" class="normal_input" size="4" /> UL列表:类型<select name="vcssListStyleType" id="vcssListStyleType" onclick="if(value=='')value='none';"> <option selected>选择</option> <option value="none">none</option> <option value="disc">disc</option> <option value="circle">circle</option> <option value="square">square</option> <option value="decimal">decimal</option> </select> 图像:<input name="vcssListStyleImageBtn" type="button" id="vcssListStyleImageBtn" onclick="vcssListStyleImage.click();" value="..."> <input name="vcssListStyleImage" id="vcssListStyleImage" type="file" value="" style="display:none;" /> 位置:<input type="radio" name="vcssListStylePosition" value="inside" onClick="if(this.checked)vcssPositionResult.value=this.value">内 <input type="radio" name="vcssListStylePosition" value="outside" onClick="if(this.checked)vcssPositionResult.value=this.value">外 <input type="radio" name="vcssVisibility" class="hiddenObj" id="unsetPosition" onClick="if(this.checked)vcssPositionResult.value='';" /><a onClick="unsetPosition.click();" style="cursor:pointer;" title="取消列表效果属性">×</a> <input name="vcssPositionResult" type="hidden" /> 光标: <select name="vcssCursor" id="vcssCursor" onclick="if(value=='')value='pointer';"> <option selected>选择</option> <option value="default">默认</option> <option value="pointer">手</option> <option value="text">文本</option> <option value="move">移动</option> <option value="crosshair">crosshair</option> <option value="default">default</option> <option value="pointer">pointer</option> <option value="hand">hand</option> <option value="move">move</option> <option value="help">help</option> <option value="wait">wait</option> <option value="text">text</option> <option value="w-resize">w-resize</option> <option value="s-resize">s-resize</option> <option value="n-resize">n-resize</option> <option value="e-resize">e-resize</option> </select> <input name="vcssOk" type="button" id="vcssOk" onClick="setSelectionWithCss(1);" value="确定"> <input name="vcssCancel" type="button" id="vcssCancel" value="取消"> <input name="vcssView" type="button" id="vcssView" onClick="setSelectionWithCss(2);" value="应用"> <input name="vcssImport" type="button" id="vcssImport" value="@import.."> <input name="vcssSave" type="button" id="vcssSave" value="保存.."> <input name="vcssLoad" type="button" id="vcssLoad" value="载入.."> <fieldset style="padding:10px; "><legend>实际应用效果如下</legend><div id="vcsseffect_div" class="vcsseffect"> Effect of This Rule Shows You at here! 工具啦 (www.tool.la) 给你最全、最好的工具!</div> </fieldset> </p></div></div> <hr /> <textarea name="cssTextValue" cols="100" rows="5" id="cssTextValue"></textarea> <input name="vcssView" type="button" id="vcssView" onclick="window.clipboardData.setData('text',document.all.cssTextValue.value);alert('CSS已保存到剪贴板');" value="复制到剪切板"> <textarea name="cssTextValueCompare" cols="100" rows="5" id="cssTextValueCompare"></textarea> <input name="vcssView2" type="button" id="vcssView" onclick="window.clipboardData.setData('text',document.all.cssTextValueCompare.value);alert('CSS已保存到剪贴板');" value="复制到剪切板"> <hr /> <div class="vv" id="vv" contentEditable="true" style="width:300px;height:50px;background-color:#ff80c0;color:#800040;border-width:1px;border-color:#ff0080;border-style:solid;margin:6px;padding:6px;float:left;font-Size:12px;"> 这是一个使用了复杂的样式的DIV,你可以使用获取CSS来获取这个CSS </div><input type="button" id="vcssView" onclick="getSelectionWithCss();setSelectionWithCss()" value="获取左侧DIV样式"> <div style="width:100% "> </div> </div> </body> </html>
[Ctrl+A 全选 注:
如需引入外部Js需刷新才能执行
]
教程首页
更多教程