+ -

javascript如何设置字体大小

时间:2021-04-28

来源:互联网

在手机上看
手机扫描阅读

今天PHP爱好者为您带来javascript设置字体大小的方法:首先设置布局,并写两个按钮;然后通过点击加减按钮来控制文字的大小,代码为【oPtxt.style.fontSize=num+'px'】。希望对大家有所帮助。

本教程操作环境:windows7系统、javascript1.8.5版,DELL G3电脑。

javascript设置字体大小的方法:

首先还是先看布局,简单写一句话,并写两个按钮:

<input id="Btn1" type="button" value="+" name=""/>
<input id="Btn2" type="button" value="-" name=""/>
<p id="p1" style="font-size:14px;">这是一些文字这是一些文字这是一些文字这是一些文字</p>

效果图如下:

9acc584ad17542eeea68bf09f35e17a.png

然后,就要通过点击加减按钮来控制文字的大小了,js代码如下:

<script>
   window.onload= function(){
       var oPtxt=document.getElementById("p1");
       var oBtn1=document.getElementById("Btn1");
       var oBtn2=document.getElementById("Btn2");
       var num = 14; /*定义一个初始变量*/
       oBtn1.onclick = function(){
           num++;
           oPtxt.style.fontSize=num+'px';
       };
       oBtn2.onclick = function(){
           num--;
           oPtxt.style.fontSize=num+'px';
       }
   }
</script>

以上就是javascript如何设置字体大小的详细内容,更多请关注php爱好者其它相关文章!