JavaScript控制字型大小

antzone發表於2017-03-14
JavaScript

使用JavaScript可以設定指定元素中文字的大小，下面通過簡單簡單的程式碼演示一下此效果。

程式碼例項如下:

[HTML] 純文字檢視 複製程式碼執行程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>js設定字型的大小-螞蟻部落</title>
<style type="text/css">
#thediv{
  width:150px;
  height:50px;
  margin:0px auto;
}
</style>
<script> 
function setSize(obj,num){
  obj.style.fontSize=num+"px"; 
}
window.onload=function(){
  var thediv=document.getElementById("thediv");
  var bt=document.getElementById("bt");
  bt.onclick=function(){setSize(thediv,30)}
}
</script> 
<body>
<div id="thediv">螞蟻部落歡迎您</div>
<input id="bt" type="button" value="設定字型的大小" />
</body>
</html>

原理非常的簡單，點選按鈕，為函式傳遞要設定字型大小的元素，和要設定的字型大小。

相關文章