首页 > 网络编程 > JavaScript > javascript技巧 > javascript 文字大小设置

javascript 改变字体大小方法集合原创

2009-06-26 13:15:51 作者：

给网页正文提供，小中大三种字体的切换功能。用js代码设置div style的fontSize属性。

第一种方法：分为大中小控制正文字体大小，一般需要指定 id

第二种方法，用的不多，有特殊需要的可以用。这个是设置body中所有的大小设置，不如上面的代码就控制正文的字体大小。大家可以根据自己的需要选用。注意多测试。

第三种方法：只有增加减小两种方法，不过很实用，本站也是用的这种方法

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<htmL> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
</head> 
<style> 
#content {font-size:12px; 
line-height:200%; 
padding:10px; 
} 
</style> 
<script language="javascript"> 
//更改字体大小 
var status0=''; 
var curfontsize=10; 
var curlineheight=18; 
function turnsmall(){ 
if(curfontsize>10){ 
document.getElementById('art_content').style.fontSize=(--curfontsize)+'pt'; 
    document.getElementById('art_content').style.lineHeight=(--curlineheight)+'pt'; 
} 
} 
function turnbig(){ 
if(curfontsize<28){ 
document.getElementById('art_content').style.fontSize=(++curfontsize)+'pt'; 
    document.getElementById('art_content').style.lineHeight=(++curlineheight)+'pt'; 
} 
} 
</script> 
<body> 
字体：[<a href="javascript:turnbig()">增加</a> <a href="javascript:turnsmall()">减小</a>]
 
<div id="art_content"> 
脚本之家 测试文本代码 
</div> 
</body> 
</htmL>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

javascript 改变字体大小方法集合 原创

您可能感兴趣的文章:

javascript 改变字体大小方法集合原创