web页在线开发

下面为效果显示

脚本说明:
把如下代码加入<body>区域中
<style>
body,td,th{font-size:9pt;color:black}
a{text-decoration:none;}
a:hover{color:blue;}
input{cursor:hand;width:30pt;background-color:cccccc;height:22px}
select{background-color:cccccc;color:navy}
</style>
<script>
self.moveTo(0,0)
self.resizeTo(screen.availWidth,screen.availHeight)
</script>
<script>
function look(){
if(event.keyCode==113){liulan.onclick()}
}
if(document.onkeydown==null)
{document.onkeydown=look}
</script>
<script language=vbs>
sub helpa()
msgbox"技巧1:[shift+回车键]为软回车,可以避免硬回车带来的一次空两行,不防试试"+Chr(10)&Chr(10)+"技巧2:脱离编辑窗口以后按下F2键可以直接开新窗口浏览你正编辑的网页"+Chr(10)&Chr(10)+"技巧3:保存功能,你可以把你编辑的HTML代码复制到里面，然后在去[我的文档]中打开"+Chr(10)&Chr(10)+"技巧4:应当注意使用右键,你现在在编辑窗内单击右键看看，有很多的实用功能"+Chr(10)&Chr(10)+"技巧5:说明窗口,你可以将鼠标靠近你不懂的地方，下面应该有说明"+Chr(10)&Chr(10)&Chr(10)+"注意1:对选中的文本进行编辑功能有限,只能对一小段文本，如果处理很多他不会起作用"+Chr(10)&Chr(10)+"注意2:HTML编辑模式时是不支持你编写head内的代码的,只能翻译body内的文本,注意哦"+Chr(10)&Chr(10)+"注意3:插入代码时,编辑窗口应该无反映，只有你在[浏览网页]时才会起作用"+Chr(10)&Chr(10)+"注意4:其实此编辑器提供的功能并不多,要做到某些效果还是得靠你手工修改HTML代码"+Chr(10)&Chr(10)+"注意5:如果你右键选择了[浏览网页]不能在编辑了，这时你试着用上面的[工作状态]"+Chr(10)&Chr(10)&Chr(10)+"秘籍:本人从来都靠HTML走天下，但很费力,后来发明了他,[拖放复制]人家东西太方便了"+Chr(10)&Chr(10)&Chr(10)+"版权:此东西是孤独刺客原创,Q:30514069,有[素质]的各位站长转载请声明出处,谢谢",4096,"孤独刺客lshdic类作品:在线WEB页制作器帮助信息"
end sub
</script>
</head>
<body leftmargin=0 topmargin=0 bgcolor=dddddd link=navy vlink=navy alink=purple onload="edit.document.designMode='on'"><base target=_blank><center>
<table cellspacing=0 cellpadding=0 border=2 width=769 id=iihj bgcolor=cccccc align=center border=0 bordercolorlight=555555 bordercolordark=white style="border-top:0px;border-left:0px"><Tr><td colspan=2 height="15" width="787"><input type=button value="新建" onClick="if(edit.document.body.innerHTML==''){alert('文件已经是空白状态')}else{if(confirm('清除所有正在编辑的网页内容?')){edit.document.body.innerHTML=''}}" style="width:40pt;background-color:aaaaaa" onmouseover="hll('将正编写的数据全部清除')" onmouseout="hll('')"><input type=button value="保存" onClick="window.open('view-source:file:///c:/my documents/在线web作品之一.html','_self')" style="width:40pt;background-color:aaaaaa" onmouseover="hll('把原代码保存在你的记事本里')" onmouseout="hll('')"><input type=button value=寄存 onClick="window.open('http://homepage.3322.net/cgi-bin/cgiwrap/longxin9/bbs/bbs.cgi?id=200110181243');alert('以打开论坛,你做好了网页,就把HTML代码临时放在那里把')" style="width:40pt;background-color:aaaaaa" onmouseover="hll('打开论坛把数据保存在那')" onmouseout="hll('')"><input type=button value="盗用" onClick="var sa=window.prompt('请问你要盗窃谁家的网页原文件?','http://');window.location='view-source:'+sa" style="width:40pt;background-color:aaaaaa" onmouseover="hll('输入正确网址,学用原代码')" onmouseout="hll('')"><input type=button value=复写 onclick="if(edit.document.selection.createRange().text!=''){edit.document.selection.createRange().text+=edit.document.selection.createRange().text}else alert('请选择一段文本')" style="width:40pt;background-color:aaaaaa" onmouseover="hll('复制选择的某段文本')" onmouseout="hll('')"><input type=button value=删除 onclick="if(edit.document.selection.createRange().text!=''){edit.document.selection.createRange().text=''}else alert('请选择一段文本')" style="width:40pt;background-color:aaaaaa" onmouseover="hll('删除选择的某段文本')" onmouseout="hll('')"><input type=button value=Help onClick="helpa()" style="width:40pt;background-color:aaaaaa;cursor:help"><select onClick="bbks.height=this.value"><option value="300">高度<option value="100">100<option value="150">150<option value="200">200<option value="250">250<option value="300" style="color:red">300<option value="350">350<option value="400">400<option value="450">450<option value="500">500</select><select onchange="edit.document.designMode=this.value"><option selected value='on'>工作状态<option value='on'>编辑状态<option value='off'>浏览状态</select><input type=checkbox style="background-color:aaaaaa" id=neweck onclick="if(eck.checked==false){if(this.checked){bbks.height=200;newtd.height=100;div1.style.visibility='';div1.style.zIndex='0';newa2.innerText='恢复'}else{bbks.height=300;newtd.height='';div1.style.visibility='hidden';div1.style.zIndex='-1';newa2.innerText='视窗'}}else{alert('此功能不可以在HTML编辑模式进行!');this.checked=false}" onmouseover="hll('选中进入学习html模式')" onmouseout="hll('')"><a id=newa2 style="font-size:12pt">视窗</a><input type=text name=newtime style="width:40pt;background-color:cccccc;cursor:text" disabled><span style="font-size:12pt">秒</font><input type=text name=zijie value=0字节 style="width:75pt" onclick="forzijie();edit.focus();"></td></tr><tr><td colspan=2><input type=button value="粗" onclick="loot('<b>'+edit.document.selection.createRange().text+'</b> ')" style="width:20pt;font-weight:900;" onmouseover="hll('加粗选中文本')" onmouseout="hll('')"><input type=button value="斜" onclick="loot('<I>'+edit.document.selection.createRange().text+'</I> ')" style="width:20pt;font-style:italic" onmouseover="hll('让选中文本倾斜')" onmouseout="hll('')"><input type=button value="A" onclick="loot('<u>'+edit.document.selection.createRange().text+'</u> ')" style="width:20pt;text-decoration:underline" onmouseover="hll('让选中文本加下划线')" onmouseout="hll('')"><input type=button value="A" onclick="loot('<s>'+edit.document.selection.createRange().text+'</s> ')" style="width:20pt;text-decoration:line-through" onmouseover="hll('让选中文本加删除线')" onmouseout="hll('')"><input type=button value="A" onclick="loot('<span style="text-decoration:overline">'+edit.document.selection.createRange().text+'</span> ')" style="width:20pt;text-decoration:overline" onmouseover="hll('让选中文本加上划线')" onmouseout="hll('')"><input type=button value="大" onclick="loot(edit.document.selection.createRange().text.big()+' ')" style="width:20pt;font-size:11pt" onmouseover="hll('让选中文本变大')" onmouseout="hll('')"><input type=button value="小" onclick="loot('<small>'+edit.document.selection.createRange().text+'</small> ')" style="width:20pt;font-size:9pt" onmouseover="hll('让选中文本变小')" onmouseout="hll('')"><input type=button value="上" onclick="loot(edit.document.selection.createRange().text.sup()+' ')" style="width:20pt;font-size:9pt" onmouseover="hll('让选中文本靠上显示')" onmouseout="hll('')"><input type=button value="下" onclick="loot(edit.document.selection.createRange().text.sub()+' ')" style="width:20pt;font-size:9pt" onmouseover="hll('让选中文本靠下显示')" onmouseout="hll('')"><input type=button value="∞" onclick="maxH()" style="width:20pt;" onmouseover="hll('让选中文本成超连接')" onmouseout="hll('')"><input type=button value="大写" onclick="loot(edit.document.selection.createRange().text.toUpperCase())" style="width:25pt;font-size:9pt" onmouseover="hll('让选英文变成大写格式')" onmouseout="hll('')"><input type=button value="小写" onclick="loot(edit.document.selection.createRange().text.toLowerCase())" style="width:25pt;font-size:9pt" onmouseover="hll('让选英文变成小写格式')" onmouseout="hll('')"><input type=button value="左" onclick="loot('<p align=left>'+edit.document.selection.createRange().text+'</p> ')" style="width:20pt;font-size:9pt" onmouseover="hll('让选中文本向左缩进')" onmouseout="hll('')"><input type=button value="中" onclick="loot('<center>'+edit.document.selection.createRange().text+'</center> ')" style="width:20pt;font-size:9pt" onmouseover="hll('让选中文本居中缩进')" onmouseout="hll('')"><input type=button value="右" onclick="loot('<p align=right>'+edit.document.selection.createRange().text+'</p> ')" style="width:20pt;font-size:9pt" onmouseover="hll('让选中文本往右缩进')" onmouseout="hll('')"><select name=zihao onclick="if(edit.document.selection.createRange().text=='')alert('请你选择一段文本')" onchange="maxM()"><option value="" selected>字号<option value="8">8<option value="">9<option value="">9<option value="">10<option value="">10<option value="11">11<option value="12">12<option value="13">13<option value="14">14<option value="15">15<option value="16">16<option value="17">17<option value="18">18<option value="19">19<option value="20">20<option value="21">21<option value="22">22<option value="23">23<option value="25">25<option value="28">28<option value="30">30<option value="35">35<option value="40">40<option value="45">45<option value="50">50<option value="60">60<option value="70">70<option value="85">85<option value="100">100<option value="120">120<option value="150">150</select><select name=uyr onchange="maxI()" onclick="if(edit.document.selection.createRange().text=='')alert('请你选择一段文本')"><option selected value="">粗度<option value=100>100<option value=200>200<option value=300>300<option value=400>400<option value=500>500<option value=600>600<option value=600>600<option value=700>700<option value=800>800<option value=900>900</select><select name=ytt onclick="if(edit.document.selection.createRange().text=='')alert('请你选择一段文本')" onchange="maxJ()"><option selected>字色<option style="BACKGROUND-COLOR: #666666" value=#666666></option><option style="BACKGROUND-COLOR: #999999" value=#999999></option><option style="BACKGROUND-COLOR: #cccccc" value=#cccccc></option><option style="BACKGROUND-COLOR: #f7f7f7" value=#f7f7f7></option><option style="BACKGROUND-COLOR: #990000" value=#990000></option><option style="BACKGROUND-COLOR: #cc0000" value=#cc0000></option><option style="BACKGROUND-COLOR: #ff0000" value=#ff0000></option><option style="BACKGROUND-COLOR: #ffff00" value=#ffff00></option><option style="BACKGROUND-COLOR: #ffff99" value=#ffff99></option><option style="BACKGROUND-COLOR: #ffffcc" value=#ffffcc></option><option style="BACKGROUND-COLOR: #0066cc" value=#0066cc></option><option style="BACKGROUND-COLOR: #0099ff" value=#0099ff></option><option style="BACKGROUND-COLOR: #00ccff" value=#00ccff></option><option style="BACKGROUND-COLOR: #006633" value=#006633></option><option style="BACKGROUND-COLOR: #009900" value=#009900></option><option style="BACKGROUND-COLOR: #00cc00" value=#00cc00></option><option style="BACKGROUND-COLOR: #ff6600" value=#ff6600></option><option style="BACKGROUND-COLOR: #ff9933" value=#ff9933></option><option style="BACKGROUND-COLOR: #ffcc66" value=#ffcc66></option><option style="BACKGROUND-COLOR: #cc0099" value=#cc0099></option><option style="BACKGROUND-COLOR: #cc00cc" value=#cc00cc></option><option style="BACKGROUND-COLOR: #cc33ff" value=#cc33ff></option><option style="background-color:yellow" value=yellow><option style="background-color:red" value=red> <opiton style="background-color:blue" value="blue"><opiton style="background-color:green" value=green><option style="background-color:orange" value="orange"><option style="background-color:black" value="black"><option style="background-color:white" value="white"><option style="background-color:gray" value="gray"><option style="background-color:lime" value="lime"><option style="background-color:navy" value="navy"><option style="background-color:purple" value="purple"><option style="background-color:maroon" value="maroon"><option style="background-color:#9addca" value="0addca"><option style="background-color:aadd9d" value="aadd9d"><option style="background-color:604599" value="604599"><option style="background-color:aaabbb" value="aaabbb"><option style="background-color:eebdac" value="eebdac"><option style="background-color:d9a9c9" value="d9a9c9"><option style="background-color:effeda" value="effeda"><option style="background-color:9d99ae" value="9d99ae"><option style="background-color:accccd" value="accccd"><option style="background-color:ce9423" value="ce9423"><option style="background-color:8aa9dd" value="9aa9dd"><option style="background-color:fedcba" value="fedcba"><option style="background-color:0f0eff" value="0f0eff"></select><select name=koob onclick="if(edit.document.selection.createRange().text=='')alert('请你选择一段文本')" onchange="maxK()" style="width:40pt"><option selected>字体<option value=黑体>黑体<option value=楷体_gb2312>楷体<option value=隶书>隶书<option value=仿宋_gb2312>仿宋<option value=Arial>Arial<option value="Arial Black">Arial<option value="Arial Narrow">Arial<option value="Comic Sans">Comic<option value="Courier New">Couri<option value=System>Syste<option value="Times New">Times<option value=Verdana>Verda<option value=Wingdings>图形<option value=Kantipur>Kanti</option></select><select name=bbiu onclick="if(edit.document.selection.createRange().text=='')alert('请你选择一段文本')" onchange="maxL()"><option selected value="">背景</option><option style="background-color:yellow" value=yellow><option style="background-color:red" value=red> <opiton style="background-color:blue" value="blue"> <opiton style="background-color:green" value=green><option style="background-color:orange" value="orange"><option style="background-color:black" value="black"><option style="background-color:white" value="white"><option style="background-color:gray" value="gray"><option style="background-color:lime" value="lime"><option style="background-color:navy" value="navy"><option style="background-color:purple" value="purple"><option style="background-color:maroon" value="maroon"><option style="background-color:#9addca" value="0addca"><option style="background-color:aadd9d" value="aadd9d"><option style="background-color:604599" value="604599"><option style="background-color:aaabbb" value="aaabbb"><option style="background-color:eebdac" value="eebdac"><option style="background-color:d9a9c9" value="d9a9c9"><option style="background-color:effeda" value="effeda"><option style="background-color:9d99ae" value="9d99ae"><option style="background-color:accccd" value="accccd"><option style="background-color:ce9423" value="ce9423"><option style="background-color:8aa9dd" value="9aa9dd"><option style="background-color:fedcba" value="fedcba"><option style="background-color:0f0eff" value="0f0eff"><option style="BACKGROUND-COLOR: #666666" value=#666666></option><option style="BACKGROUND-COLOR: #999999" value=#999999></option><option style="BACKGROUND-COLOR: #cccccc" value=#cccccc></option><option style="BACKGROUND-COLOR: #f7f7f7" value=#f7f7f7></option><option style="BACKGROUND-COLOR: #990000" value=#990000></option><option style="BACKGROUND-COLOR: #cc0000" value=#cc0000></option><option style="BACKGROUND-COLOR: #ff0000" value=#ff0000></option><option style="BACKGROUND-COLOR: #ffff00" value=#ffff00></option><option style="BACKGROUND-COLOR: #ffff99" value=#ffff99></option><option style="BACKGROUND-COLOR: #ffffcc" value=#ffffcc></option><option style="BACKGROUND-COLOR: #0066cc" value=#0066cc></option><option style="BACKGROUND-COLOR: #0099ff" value=#0099ff></option><option style="BACKGROUND-COLOR: #00ccff" value=#00ccff></option><option style="BACKGROUND-COLOR: #006633" value=#006633></option><option style="BACKGROUND-COLOR: #009900" value=#009900></option><option style="BACKGROUND-COLOR: #00cc00" value=#00cc00></option><option style="BACKGROUND-COLOR: #ff6600" value=#ff6600></option><option style="BACKGROUND-COLOR: #ff9933" value=#ff9933></option><option style="BACKGROUND-COLOR: #ffcc66" value=#ffcc66></option><option style="BACKGROUND-COLOR: #cc0099" value=#cc0099></option><option style="BACKGROUND-COLOR: #cc00cc" value=#cc00cc></option><option style="BACKGROUND-COLOR: #cc33ff" value=#cc33ff></option></select><select name=sppn onclick="if(edit.document.selection.createRange().text=='')alert('请你选择一段文本')" onchange="if(this.options[1].selected){var arv=prompt('请输入他的基本颜色，默认red,为红色,你也可以输入ffedff[粉红]做为颜色','red');this.options[1].value='glow(color='+arv+')'};if(this.options[3].selected){var arv1=prompt('请输入下落阴影的颜色，例如lime[亮绿]色的颜色代码，默认为白色','white');this.options[3].value='shadow(color='+arv1+')'};if(this.options[5].selected){var arv2=prompt('请输入立体文字的颜色，默认为black[黑色],你也可更改,例如改成red代码,他表示[红色]','black');this.options[5].value='dropshadow(color='+arv2+')'};maxN()" onmouseover="hll('给选中文本加些特殊效果')" onmouseout="hll('')"><option selected value="">效果<option value="glow">光晕<option value="blur">模糊<option value="shadow">阴影<option value="alpha(opacity=10)">透明<option value="dropshadow">立体</select></td></tr><tr><td id=fortab></td></tr><tr><td id=bbks height=300><table cellspacing=0 cellpadding=0 align=left align=top width=10 height=100%><tr><Td><input type=button value=↓ onClick="edit.document.body.innerHTML+='<br>';edit.focus();" style="background-color:#bbbbbb;width:20pt;height:10%" onmouseover="hll('单击编辑窗口[换一行]')" onmouseout="hll('')"><br><input type=button value="." onClick="edit.document.body.innerHTML+=' ';edit.focus()" style="background-color:#bbbbbb;width:20pt;height:10%" onmouseover="hll('单击编辑窗口[空一格]')" onmouseout="hll('')"><br><input type=button value="━" onClick="if(eck.checked==false){var hrtt=prompt('请输入[水平线的颜色]的HTML代码,例如输入red代表红色，如果任何不输入则默认水平线颜色为gray[灰色]','');edit.document.body.innerHTML+='<hr size=2 color="'+hrtt+'" style="">'}else alert('此功能不可以在HTML编辑模式使用')" style="width:20pt;height:10%" onmouseover="hll('插入[水平线]')" onmouseout="hll('')"><br><input type=button value=囍 onClick="if(eck.checked==false){img11()}else alert('此功能不可以在HTML编辑模式使用')" style="width:20pt;height:10%" onmouseover="hll('插入图片')" onmouseout="hll('')"><br><input type=button value="~~" onClick="if(eck.checked==false){mar()}else alert('此功能不可以在HTML编辑模式使用')" style="width:20pt;height:10%" onmouseover="hll('插入动画字幕')" onmouseout="hll('')"><br><input type=button value="Ⅲ" onclick="if(eck.checked==false){fortab1()}else alert('此功能不可以在HTML编辑模式使用')" style="width:20pt;height:10%" onmouseover="hll('插入表格，值请自行修改')" onmouseout="hll('')"><br><input type=button value="E" onclick="if(eck.checked==false){var mail=prompt('请输入电子邮件地址',' @ .com');edit.document.body.innerHTML+='<a href=mailto:'+mail+'>与我联系</a>'}else alert('此功能不可以在HTML编辑模式使用')" style="width:20pt;height:10%" onmouseover="hll('插入启动outlook邮件')" onmouseout="hll('')"><br><input type=button value="□" onclick="if(eck.checked==false){forme1()}else alert('此功能不可以在HTML编辑模式使用')" style="width:20pt;height:10%" onmouseover="hll('插入浮动窗口iframe')" onmouseout="hll('')"><br><input type=button value="层" onclick="if(eck.checked==false){edit.document.body.innerHTML+='<div style="position:absolute;top:30px;left:35px;width:300;height:200;z-index:2;background-color:eeeeee;overflow:scroll;" id=div1>请修改他的元素属性</div>';alert('[立体图层]已经插入,你可单击浏览网页查看样式，修改请进入HTML编辑模式')}else alert('此功能不可以在HTML编辑模式使用')" style="width:20pt;height:10%" onmouseover="hll('插入一个立体图层')" onmouseout="hll('')"><br><input type=button value=音 onClick="if(eck.checked==false){edit.document.body.innerHTML+='<embed src="rtsp://ent.online.ln.cn/ent.online.ln.cn/LegendofZu_01.rm" type="audio/x-pn-realaudio-plugin" console=Clip1 controls=IMAGEWINDOW,ControlPanel,StatusBar height=200 width=200 autostart=true></embed>';alert('[realplayer播放器]已经插入,你可单击浏览网页查看正播放的电影，修改请进入HTML编辑模式,如果想保持播放器正常，你必须装有realplayer播放器软件')}else alert('此功能不可以在HTML编辑模式使用')" style="width:20pt;height:10%" onmouseover="hll('插入一个多媒体播放器')" onmouseout="hll('')"></td></tr></table><iframe id=edit width=100% height=100% marginwidth=0 marginheight=0 frameborder=1></iframe></td></tr><Tr><Td id=newtd align=left><div style="position:absolute;z-index:-1;background-color:dddddd;overflow:scroll;visibility:hidden;width:100%;height:100%" id=div1 align=left onmouseover="hll('原代码显示图层')" onmouseout="hll('')"></div></td></tr><tr><td colspan=2 width="787"><input type=checkbox onClick="if(neweck.checked==false){if(this.checked){edit.document.body.style.fontSize='12pt';edit.document.body.style.fontFamily='System';var kaocao=edit.document.body.innerHTML;edit.document.body.innerText='<html>\n<head>\n<title>欢迎光临我的主页</title>\n<META http-equiv=Content-Type content=text/html; charset=gb2312>\n\n<style type=text/css>\nbody,th,td{font-size:'+cs2.value+';color:'+cs3.options[cs3.selectedIndex].value+';font-family:'+cs4.options[cs4.selectedIndex].value+';}\na.link{color:'+cs5.options[cs5.selectedIndex].value+';text-decoration:none;}\nimg{}\ninput{}\n</style>\n</head>\n<body topmargin=2 leftmargin=2 bgcolor='+cs9.options[cs9.selectedIndex].value+' background='+cs10.value+'>\n\n'+kaocao+'\n\n</body>\n</html>';newa.innerText='选中进入皮肤编辑模式'}else{edit.document.body.style.fontSize=cs2.value;edit.document.body.style.fontFamily=cs4.value;edit.document.body.innerHTML=edit.document.body.innerText;newa.innerText='选中进入HTML编辑模式'}}else{alert('请把视窗功能关闭!否则不可进行');this.checked=false}" id="eck" onmouseover="hll('编辑状态的切换方式')" onmouseout="hll('')"><a id=newa>选中进入HTML编辑模式</a> <a style="color:red;cursor:hand;" onClick="if(eck.checked==false){var asb=edit.document.body.innerHTML;op=window.open('','newin','');op.document.open();op.focus();op.document.write('<html>\n<head>\n<title>欢迎光临我的网页</title>\n<META http-equiv=Content-Type content=text/html; charset=gb2312>\n\n<style type=text/css>\nbody,th,td{font-size:'+cs2.value+';color:'+cs3.options[cs3.selectedIndex].value+';font-family:'+cs4.options[cs4.selectedIndex].value+';}\na{color:'+cs5.options[cs5.selectedIndex].value+';text-decoration:none;}\nimg{}\ninput{}\n</style>\n</head>\n<body topmargin=2 leftmargin=2 bgcolor='+cs9.options[cs9.selectedIndex].value+' background='+cs10.value+'>\n\n'+asb+'\n\n</body>\n</html>');op.document.close()}else {var asb=edit.document.body.innerHTML;op=window.open('','newin','');op.document.open();op.focus();op.document.write(edit.document.body.innerText);op.document.close()}" onMouseOver="this.style.color='white';hll('查看在浏览器运行的效果')" onMouseOut="this.style.color='red';hll('')" id="liulan">浏览网页</a> <input type=button value=Enter onClick="if(eck.checked==false){if(iiss.options[0].selected==false){edit.document.body.innerHTML+=iiss.value}else alert('[选择表单]无数据，请选择他覆盖的元素')}else alert('此功能不可以在HTML编辑模式使用')" style="width:35pt"><select id=iiss><option selected>选择表单<option value="<input type=text name='' size=''>">小文本框<option value="<textarea cols='25' rows='3' name=''>

">大文本框