文本域中如何显示彩色文本?
字号也可以改变,段落间距 问题点数:100、回复次数:9Top
1 楼abigfrog(千年精灵)(★JAVA★)回复于 2002-09-26 20:32:53 得分 10
用cssTop
2 楼BinLee(风之子)回复于 2002-09-26 20:37:36 得分 0
怎么用?举个例子Top
3 楼gdmm(gdmm)回复于 2002-09-26 20:56:57 得分 10
<select>
<option value="1" selected style='color:#ff0000'>1</option>
<option value="2">2</option>
</select>
<select>可以换成其它比如:input textareaTop
4 楼beyond_xiruo(CorruptionException)回复于 2002-09-26 21:01:27 得分 10
<input type="text" name="T1" size="20" style="color: #FF0000; text-decoration: underline; font-size: 36pt">Top
5 楼lbf2002(绝地仓狼)回复于 2002-09-26 21:09:05 得分 10
BinLee (风之子) 你好:
将以下代码加丰成一个CSS文件,然后在HTML和ASP中调入就可以了!下面是四种简单的代码
p { background-color: silver }
div { background-color: rgb(223,71,177) }
body { background-color: #98AB6F }
pre { background-color: transparent; }
Top
6 楼BrightEye(男儿当自强,靠别人不如靠自己)回复于 2002-09-26 21:11:02 得分 10
斑竹好快啊!分明是抢分嘛!!呵呵....你都红星闪闪了呀.:)Top
7 楼BinLee(风之子)回复于 2002-09-26 21:17:57 得分 0
能实现文本域内的文本的动态编辑吗?改变字号,颜色Top
8 楼Reve(仨仁仕)回复于 2002-09-26 21:30:46 得分 50
可以。参考一下代码:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Editable Regions Sample</TITLE>
<STYLE>
BODY{margin:0;
background:white;
font-family:verdana;
font-size:80%;}
BUTTON {cursor:hand;
background:#ffffff;
border-color:#99ccff;
font-weight:bold;}
.bar{background:#336699;
width:100%;
height:30px;
border-top:1px solid #99CCFF;
border-bottom:1px solid #000000;}
.desbar{background:#FFFFFF;
width:100%;
padding: 10px;
border-top:1px solid #CCCCCC;
border-bottom:1px solid #000000;
color:black;
font-size:8pt;
height:105;}
.title{font-size:15pt;
color:white;
padding-left:10px;}
.bar A:link {text-decoration:none; color:white}
.bar A:visited {text-decoration:none; color:white}
.bar A:active {text-decoration:none; color:white}
.bar A:hover {text-decoration:none; color:yellow}
</STYLE>
<SCRIPT>
<!-- The fnInit function initializes the editable and non-editable regions -->
<!-- of the document -->
function fnInit(){
<!-- Ensure the display interface is not selectable, by making all -->
<!-- elements UNSELECTABLE -->
for (i=0; i<document.all.length; i++)
document.all(i).unselectable = "on";
<!-- Prepare the editable regions -->
oDiv.unselectable = "off";
oTextarea.unselectable = "off";
}
<!-- The fnToggleEdits function turns editing on or off in the editable -->
<!-- regions of the document -->
function fnToggleEdits(oObj,oBtn) {
currentState = oObj.isContentEditable;
newState = !currentState;
oObj.contentEditable = newState;
newState==false ? oBtn.innerHTML='Turn Editing On' :
oBtn.innerHTML='Turn Editing Off';
}
</SCRIPT>
</HEAD>
<BODY onload="fnInit();">
<!-- TOOLBAR_START --><!-- TOOLBAR_EXEMPT --><!-- TOOLBAR_END -->
<DIV CLASS="bar title">Editable Regions Sample</DIV>
<DIV CLASS="desbar">
<H4 style="font-size:10pt;">This example demonstrates the features of
Microsoft® Internet Explorer that enable users to edit the content
of an HTML element directly from the browser.</H4>
<P>This HTML editor is a <B>DIV</B> element set to be content-editable. Any
valid HTML content (text, images, form controls, etc.) can be pasted
and edited in this editor.</P>
<DIV ALIGN="center">
<DIV ALIGN="center" STYLE="height:210; width:90%;
background-color:#99CCFF; border:1px solid black">
<DIV CLASS="bar title">HTMLEditor (Content-Editable DIV)</DIV>
<DIV style="padding:10px">
<BUTTON ID="oEditDiv" TITLE="Turn Editing Off"
onclick='fnToggleEdits(oDiv,oEditDiv);oDiv.focus();'>
Turn Editing Off</BUTTON>
<BUTTON ID="oBoldBtn" TITLE="Bold"
onclick='if (oDiv.isContentEditable==true)
document.execCommand("Bold");'><B>Bold</B></BUTTON>
<BUTTON ID="oItalicBtn" TITLE="Italic"
onclick='if (oDiv.isContentEditable==true)
document.execCommand("Italic");'><I>Italic</I></BUTTON>
<BUTTON ID="oUndLnBtn" TITLE="Underline"
onclick='if (oDiv.isContentEditable==true)
document.execCommand("Underline");'><U>Underline</U></BUTTON>
</DIV>
<DIV id=oDiv CONTENTEDITABLE ALIGN=left STYLE="height:100;
width:95%;background-color:white; font-face:Arial; padding:3;
border:inset #99ccff; scrollbar-base-color:#99ccff;
overflow=auto;"></DIV>
<BUTTON TITLE="Append from HTMLEditor"
onclick='oTextarea.value+=oDiv.innerHTML;oTextarea.focus();'>
Append to TextEditor</BUTTON>
</DIV>
</DIV>
<P>This text editor is a <B>TEXTAREA</B> element and is content-editable by
default. Only text can be edited in this tool. However, you can draft
HTML in the TEXTEditor and press the <B>Append to HTMLEditor</B> button
to see the result appended to HTMLEditor. The <B>Append to
TextEditor</B> button reverses this process by appending the
HTMLEditor's HTML as text to the TEXTEditor.
</P>
<BR/>
<DIV ALIGN="center">
<DIV ALIGN="center" STYLE="height:210; width:90%;
background-color:#99ccff; border:1px solid black">
<DIV CLASS="bar title">TEXTEditor (TEXTAREA)</DIV>
<DIV style="padding:10">
<BUTTON ID="oEditText" TITLE="Turn Editing Off"
onclick='fnToggleEdits(oTextarea,oEditText);
oTextarea.focus();'>Turn Editing Off</BUTTON>
</DIV>
<TEXTAREA id=oTextarea ALIGN=left STYLE="height:100; width:95%;
background-color:white; padding:3; border:inset #99ccff;
scrollbar-base-color:#99ccff; overflow=auto;"></TEXTAREA><BR/>
<BUTTON TITLE="Append to HTMLEditor"
onclick='oDiv.innerHTML+=oTextarea.value;oTextarea.focus();'>
Append to HTMLEditor</BUTTON>
</DIV>
</DIV>
<BR/>
<P>Both editors use the same function to activate or deactivate editing.
The function uses the <B>isContentEditable</B> property to test whether
editing is active. Accordingly, the <B>contentEditable</B> property is
then reversed to reset editing.</P>
</DIV>
<DIV CLASS="bar" STYLE=" padding:5px; padding-left:10">
<A href="http://www.microsoft.com/misc/cpyright.htm" target=_top>
©2001 Microsoft Corporation. All rights reserved. Terms of use.</A>
</DIV>
</body>
</html>
Top
9 楼muxinpp(木心 Pontus)回复于 2002-09-26 21:38:23 得分 0
哦Top




