<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>css--font例子</title>
<style>
#idDIV{
width:100%; /*名为idDIV的宽度100%*/
height:80px; /*名为idDIV的高度80px*/
background-color:#ffD700; /*名为idDIV的背景色#ffd700*/
padding:4px; /*间隙属性:
说明:
检索或设置对象四边的内补丁。对于 td 和 th 对象而言默认值为 1 。
其他对象的默认值为 0 。如果提供全部四个参数值,将按上-右-下-左的顺序作用于四边。
如果只提供一个,将用于全部的四条边。如果提供两个,第一个用于上-下,第二个用于左-右。
如果提供三个,第一个用于上,第二个用于左-右,第三个用于下。 在IE5.5+中此属性支持内联对象使用。
而在此前的版本中,内联要素要使用该属性,必须先设定对象的 height 或 width 属性,
或者设定 position 属性为 absolute ,或者设定 display 属性为 block 。
此属性对于 currentStyle 对象而言是只读的。对于其他对象而言是可读写的。对应的脚本特性为 padding 。
*/
font : normal normal normal medium normal "Times New Roman" ; /*初始化idDIV下的字体*/
}
#idCodeDiv{
width:100%;
padding:4px;
font-family:verdana,tahoma;
margin:12px 0px 0px 0xp;
background-color:#EEE;
font-weight:bold;
}
</style>
<script>
function rdl_change(){
var oCodeDiv=document.all("idCodeDiv");
var oDiv=document.all("idDiv");
/**
with语句 = document.all("idSel").value;
with例子:
with (object)
statements
参数
object
新的默认对象。
statements
一个或多个语句,object 是该语句的默认对象。
说明
with 语句通常用来缩短特定情形下必须写的代码量。在下面的例子中,请注意 Math 的重复使用:
x = Math.cos(3 * Math.PI) + Math.sin(Math.LN10)
y = Math.tan(14 * Math.E)
当使用 with 语句时,代码变得更短且更易读:
with (Math){
x = cos(3 * PI) + sin (LN10)
y = tan(14 * E)
}
**/
with (document.all("idSel")) {
var sValue=options[selectedIndex].value;
}
oDiv.style.font=sValue;
oCodeDiv.innerText="font:"+sValue+";";
}
</script>
</head>
<body>
<div id="idDiv">
Every man dies,Not every man really lives.<br/>
请记住上面这句话。
</div>
<br/>
<select id="idSel" οnchange="rdl_change();">
<option value="normal normal normal medium normal 'Times New Roman'">---font---</option>
<option value="italic small-caps 600 12pts/18pts 宋体">italic small-caps 600 12pts/18pts 宋体</option>
<option value="caption">caption<option>
<option value="icon">icon</option>
<option value="menu">menu</option>
<option value="message-box">message-box</option>
<option value="small-caption">small-caption</option>
<option value="status-bar">status-bar</option>
</select>
<br/>
<div id="idCodeDiv">font : normal normal normal medium normal "Times New Roman" ;</div>
</body>
</html>