web前端

位置:IT落伍者 >> web前端 >> 浏览文章

超级HTMLHTMLEditor----winXP风格[1]


发布日期:2022年08月31日
 
超级HTMLHTMLEditor----winXP风格[1]

<html>

<head>

<META NAME="GENERATOR" Content="Microsoft Visual Studio 6.0">

<title>Looker HTML Editor v1.0</title>

<style type="text/CSS">

nu_td

{

BORDER-RIGHT: #D3E5FB 2px solid;

BORDER-TOP: #D3E5FB 2px solid;

BORDER-LEFT: #D3E5FB 2px solid;

BORDER-BOTTOM: #D3E5FB 2px solid;

HEIGHT: 20px;

FONT-WIDTH: bold;

FONT-SIZE: 70%;

COLOR: #003366;

FONT-FAMILY: verdana,sans-serif

}

nu_select

{

COLOR: #003366;

FONT-FAMILY: verdana,sans-serif

}

.workplace

{

height:100%;

width:100%;

background-color:white;

font-face:Arial;

padding:3;

border:inset #99ccff;

scrollbar-base-color:#99ccff;

overflow=auto;

}

A

{

FONT-FAMILY: verdana,sans-serif;

TEXT-DECORATION: none

}

A:active

{

COLOR: #003366;

TEXT-DECORATION: none

}

A:link

{

COLOR: #003366;

TEXT-DECORATION: none

}

A:visited

{

COLOR: #003366;

TEXT-DECORATION: none

}

</style>

<script language="javascript">

var sds;

sds=1;

var nono;

nono=0;

function ds()

{

if (sds == 1)

{

oDiv.innerText = oDiv.innerHTML;

ods.src = "design.gif";

sds=0;

}

else

{

sds=1;

ods.src = "source.gif";

oDiv.innerHTML = oDiv.innerText;

}

}

function mouseovertd (o)

{

o.style.backgroundColor= "#7ABBFF";

o.style.borderStyle="solid";

o.style.borderColor="#316AC5";

lor="#ffffff";

}

function mouseouttd (o)

{

o.style.backgroundColor="#D3E5FB";

lor="#003366";

o.style.borderColor="#D3E5FB";

}

function gzhs()

{

if (nono == 0)

{

oDiv.focus();

}

}

function addScript()

{

oDiv.innerHTML += "<SCR" + "IPT LANGUAGE=\"javascript\">\n<!--\n/// 请不要插入恶性代码,谢谢。tw.wINGWiT.CoM ///\n//-- START --//\n\n//-- END --//\n//-->\n</SCR" + "IPT>";

}

function addTable(){

var iHeight, iWidth;

var sTable = prompt("输入行数,列数\n如:3,4", "2,2");

if (sTable == null)

{

return 0;

}

var i = sTable.indexOf(",");

if (i < 1)

{

alert("输入错误");

return 0;

}

iHeight = parseInt(sTable.substr(0,i++));

if (isNaN(iHeight))

{

alert("表格行数不是整数!");

return 0;

}

if (iHeight < 1)

{

alert("表格行数不是正整数!");

return 0;

}

if (iHeight > 20)

{

alert("表格行数过大!");

return 0;

}

iWidth = parseInt(sTable.substr(i));

if (isNaN(iWidth))

{

alert("表格列数不是整数!");

return 0;

}

if (iWidth < 1)

{

alert("表格列数不是正整数!");

return 0;

}

if (iWidth > 20)

{

alert("表格列数过大!");

return 0;

}

var sHTML = "<table border=1>";

for(i=0;i<iHeight;i++)

{

sHTML += "<tr>"

for(j=0;j<iWidth;j++)

{

sHTML += "<td> </td>";

}

sHTML += "</tr>";

}

sHTML += "</table>";

oDiv.innerHTML+=sHTML;

}

function get_color(what)

{

var strcolor = showModalDialog("color.asp","","dialogWidth:18;dialogHeight:16;dialogTop:50;dialogLeft:500;status:no;");

if (strcolor != "")

{

oDiv.document.execCommand(what,false,strcolor);

}

}

function set_font_color()

{

oDiv.document.execCommand('FormatBlock',font_format.value);

}

</script>

</head>

<body bottommargin=0 leftmargin=0 topmargin=0 rightmargin=0 scroll=no >

<table width=100% height="100%" cellspacing=0 cellpadding=0 border=0 bgcolor=#D3E5FB>

<tr>

<td height="20">

<table cellspacing=0 cellpadding=0 border=0 bgcolor=#D3E5FB>

<tr>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('Cut')" onmouseout="javascript:mouseouttd(this)">

<img alt="剪切" border="0" src="cut.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('Copy')" onmouseout="javascript:mouseouttd(this)">

<img alt="复制" border="0" src="copy.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('Paste')" onmouseout="javascript:mouseouttd(this)">

<img alt="粘贴" border="0" src="paste.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('Undo')" onmouseout="javascript:mouseouttd(this)">

<img alt="撤销" border="0" src="undo.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('Redo')" onmouseout="javascript:mouseouttd(this)">

<img alt="恢复" border="0" src="redo.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:addScript()" onmouseout="javascript:mouseouttd(this)">

<img alt="加入脚本" border="0" src="script.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:addTable()" onmouseout="javascript:mouseouttd(this)">

<img alt="表格" border="0" src="table.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('InsertImage',true)" onmouseout="javascript:mouseouttd(this)">

<img alt="插入图像" border="0" src="image.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('CreateLink',true)" onmouseout="javascript:mouseouttd(this)">

<img alt="增加连接" border="0" src="link.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('InsertHorizontalRule')" onmouseout="javascript:mouseouttd(this)">

<img alt="水平线" border="0" src="hr.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('JustifyLeft')" onmouseout="javascript:mouseouttd(this)">

<img alt="左对齐" border="0" src="left.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('JustifyCenter')" onmouseout="javascript:mouseouttd(this)">

<img alt="居中" border="0" src="center.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('JustifyRight')" onmouseout="javascript:mouseouttd(this)">

<img alt="右对齐" border="0" src="right.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('InsertOrderedList')" onmouseout="javascript:mouseouttd(this)">

<img alt="编号列表" border="0" src="ol.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('InsertUnorderedList')" onmouseout="javascript:mouseouttd(this)">

<img alt="项目符号列表" border="0" src="ul.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('Outdent')" onmouseout="javascript:mouseouttd(this)">

<img alt="减少缩进" border="0" src="outdent.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('Indent')" onmouseout="javascript:mouseouttd(this)">

<img alt="增加缩进" border="0" src="indent.gif" width="20" height="20">

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td height="20">

<table cellspacing=0 cellpadding=0 border=0 bgcolor=#D3E5FB>

<tr>

<td class="menu_td" onmouseout="javascript:mouseouttd(this)">

<select name="font_format" class="menu_select" onblur="javascript:nono=0;gzhs()">

<option value="<P>">普通</option>

<option value="<PRE>">带格式的</option>

<option value="<address>">地址</option>

<option value="<h1>">标题1</option>

<option value="<h2>">标题2</option>

<option value="<h3>">标题3</option>

<option value="<h4>">标题4</option>

<option value="<h5>">标题5</option>

<option value="<h6>">标题6</option>

<option value="<ol>">编号列表</option>

<option value="<ul>">项目符号列表</option>

<option value="<dir>">目录列表</option>

<option value="<menu>">菜单列表</option>

</select>

</td>

<td class="menu_td" onmouseout="javascript:mouseouttd(this)">

<select name="font_face" class="menu_select" onblur="javascript:nono=0;gzhs()">

<option value="宋体">宋体</option>

<option value="黑体">黑体</option>

<option value="楷体_GB2312">楷体</option>

<option value="仿宋_GB2312">仿宋</option>

<option value="隶书">隶书</option>

<option value="幼圆">幼圆</option>

<option value="新宋体">新宋体</option>

<option value="细明体">细明体</option>

<option value="Arial">Arial</option>

<option value="Arial Black">Arial Black</option>

<option value="Arial Narrow">Arial Narrow</option>

<option value="Bradley Hand ITC">Bradley Hand ITC</option>

<option value="Brush Script MT">Brush Script MT</option>

<option value="Century Gothic">Century Gothic</option>

<option value="Comic Sans MS">Comic Sans MS</option>

<option value="Courier">Courier</option>

<option value="Courier New">Courier New</option>

<option value="MS Sans Serif">MS Sans Serif</option>

<option value="sans-serif">sans-serif</option>

<option value="Script">Script</option>

<option value="System">System</option>

<option value="Tahoma">Tahoma</option>

<option value="Times New Roman">Times New Roman</option>

<option value="Viner Hand ITC">Viner Hand ITC</option>

<option value="Verdana">Verdana</option>

<option value="Wide Latin">Wide Latin</option>

<option value="Wingdings">Wingdings</option>

</select>

</td>

<td class="menu_td" onmouseout="javascript:mouseouttd(this)">

<select name="font_size" class="menu_select" onblur="javascript:nono=0;gzhs()">

<option selected>普通</option>

<option value="1">1 (8 磅)</option>

<option value="2">2 (10 磅)</option>

<option value="3">3 (12 磅)</option>

<option value="4">4 (14 磅)</option>

<option value="5">5 (18 磅)</option>

<option value="6">6 (24 磅)</option>

<option value="7">7 (36 磅)</option>

</select>

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('Bold')" onmouseout="javascript:mouseouttd(this)">

<img alt="粗体" border="0" src="bold.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('Italic')" onmouseout="javascript:mouseouttd(this)">

<img alt="斜体" border="0" src="italic.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:oDiv.document.execCommand('Underline')" onmouseout="javascript:mouseouttd(this)">

<img alt="下画线" border="0" src="underline.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:get_color('BackColor')" onmouseout="javascript:mouseouttd(this)">

<img alt="突出颜色显示" border="0" src="bgcolor.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:get_color('ForeColor')" onmouseout="javascript:mouseouttd(this)">

<img alt="字体颜色" border="0" src="fontcolor.gif" width="20" height="20">

</td>

<td class="menu_td" onclick="javascript:ds()" onmouseout="javascript:mouseouttd(this)">

<img alt="设计/原码" name="ods" border="0" src="source.gif" width="40" height="20">

</td>

</tr>

</table>

</td>

</tr>

<tr>

<td>

<DIV id=oDiv name=oDiv CONTENTEDITABLE onblur="javascript:gzhs()" ALIGN=left class="workplace"><p></p></DIV>

</td>

</tr>

</table>

</body>

</html>

上一篇:虚拟现实XML优点是什么?

下一篇:rpcss.exe系统进程介绍