1，用样式表(css),在组件里面加上style属性，例如:
<div style="background-color:bluefont-family:宋体">
欢迎你
</div>
2，直接在字体两边加font标记，例如：
<font color=blue >欢迎你</font>
扩展资料
<input name="submit" type="submit" value="changeColor" onClick="changeColor()">
<span id="wenzi">wenzi</span>
<script>
function changeColor(){
document.all['wenzi'].style.color="#ff0000"
}
</script>
参考资料：百度百科 CSS（层叠样式表）
jsp 提示框颜色设置方法：jsp中可以嵌入通用的js写的弹出框提示，只要根据不同场景传不同参数就可以了。
参考代码如下：
<html>
<head>
<meta http-equiv="Content-Type" content="text/htmlcharset=utf-8" />
<title>弹出窗口(可拖动，背景灰色透明)</title>
<script type="text/javascript">
<!--
/*FileName:AlertMsg.js
title:提示标题
content:提示的内容*/
document.write("<style type=\"text/css\">*{padding:0margin:0}.close{float:rightcursor:default}</style>")
function $(id){ return document.getElementById(id)}
function AlertMsg(title,content){
var msgw,msgh,msgbg,msgcolor,bordercolor,titlecolor,titlebg,con
con = "<form><table style='margin:10px 15px 15px 15pxborder:0'><tr><th style='border:0line-height:22pxpadding:3px 0vertical-align:topfont-weight:bold'>分类：</th><td style='border:0line-height:22pxpadding:3px 0vertical-align:topwidth:75%'><input type='text' name='typename' size='20'/></td></tr><tr><th></th><td style='border:0line-height:22pxpadding:3px 0vertical-align:topwidth:75%'><button style='line-height:normal' type='submit' onclick='return submitform()'>确定</button> <button style='line-height:normal' type='reset'>取消</button></td></tr></table></form>"
//弹出窗口设置
msgw = 300//窗口宽度
msgh = 150//窗口高度
msgbg = "#FFF"//内容背景
msgcolor = "#000"//内容颜色
bordercolor = "#000"//边框颜色
titlecolor = "#FFF"//标题颜色
titlebg = "#369"//标题背景
//遮罩背景设置
var sWidth,sHeight
sWidth = screen.availWidth
sHeight = document.body.scrollHeight
//创建遮罩背景
var maskObj = document.createElement("div")
maskObj.setAttribute('id','maskdiv')
maskObj.style.position = "absolute"
maskObj.style.top = "0"
maskObj.style.left = "0"
maskObj.style.background = "#777"
maskObj.style.filter = "Alpha(opacity=30)"
maskObj.style.opacity = "0.3"
maskObj.style.width = sWidth + "px"
maskObj.style.height = sHeight + "px"
maskObj.style.zIndex = "10000"
document.body.appendChild(maskObj)
//创建弹出窗口
var msgObj = document.createElement("div")
msgObj.setAttribute("id","msgdiv")
msgObj.style.position ="absolute"
msgObj.style.top = (screen.availHeight - msgh) / 4 + "px"
msgObj.style.left = (screen.availWidth - msgw) / 2 + "px"
msgObj.style.width = msgw + "px"
msgObj.style.height = msgh + "px"
msgObj.style.fontSize = "12px"
msgObj.style.background = msgbg
msgObj.style.border = "1px solid " + bordercolor
msgObj.style.zIndex = "10001"
//创建标题
var thObj = document.createElement("div")
thObj.setAttribute("id","msgth")
thObj.className = "DragAble"
thObj.style.cursor = "move"
thObj.style.padding = "4px 6px"
thObj.style.color = titlecolor
thObj.style.background = titlebg
var titleStr = "<a class='close' title='关闭' style='cursor:pointer' onclick='CloseMsg()'>关闭</a>"+"<span>"+ title +"</span>"
thObj.innerHTML = titleStr
//创建内容
var bodyObj = document.createElement("div")
bodyObj.setAttribute("id","msgbody")
bodyObj.style.padding = "10px"
bodyObj.style.lineHeight = "1.5em"
bodyObj.innerHTML = con
var txt = document.createTextNode(content)
bodyObj.appendChild(txt)
//生成窗口
document.body.appendChild(msgObj)
$("msgdiv").appendChild(thObj)
$("msgdiv").appendChild(bodyObj)
}
function CloseMsg(){
//移除对象
document.body.removeChild($("maskdiv"))
$("msgdiv").removeChild($("msgth"))
$("msgdiv").removeChild($("msgbody"))
document.body.removeChild($("msgdiv"))
}
//拖动窗口
var ie = document.all
var nn6 = document.getElementById&&!document.all
var isdrag = false
var y,x
var oDragObj
function moveMouse(e) {
if (isdrag) {
oDragObj.style.top = (nn6 ? nTY + e.clientY - y : nTY + event.clientY - y)+"px"
oDragObj.style.left = (nn6 ? nTX + e.clientX - x : nTX + event.clientX - x)+"px"
return false
}
}
function initDrag(e) {
var oDragHandle = nn6 ? e.target : event.srcElement
var topElement = "HTML"
while (oDragHandle.tagName != topElement &&oDragHandle.className != "DragAble") {
oDragHandle = nn6 ? oDragHandle.parentNode : oDragHandle.parentElement
}
if (oDragHandle.className=="DragAble") {
isdrag = true
oDragObj = oDragHandle.parentNode
nTY = parseInt(oDragObj.style.top)
y = nn6 ? e.clientY : event.clientY
nTX = parseInt(oDragObj.style.left)
x = nn6 ? e.clientX : event.clientX
document.onmousemove = moveMouse
return false
}
}
document.onmousedown = initDrag
document.onmouseup = new Function("isdrag=false")
//-->
</script>
</head>
<body>
<table width="600" border="0" cellspacing="0" cellpadding="0">
<tr >
<td height="100" align="center" >
<p><a href="javascript:AlertMsg("温馨提示",'')">点我试试!</a></p>
</td>
</tr>
</table>
</div>
</body>
</html>
