首頁 > web前端 > js教程 > javascript如何設定字體大小

javascript如何設定字體大小

coldplay.xixi
發布: 2023-01-04 09:35:16
原創
8751 人瀏覽過

javascript設定字體大小的方法:先設定佈局,並寫兩個按鈕;然後透過點擊加減按鈕來控製文字的大小,程式碼為【oPtxt.style.fontSize=num 'px'】。

javascript如何設定字體大小

本教學操作環境: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>
登入後複製

效果圖如下:

javascript如何設定字體大小

然後,就要透過點擊加減按鈕來控製文字的大小了,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+&#39;px&#39;;
        };
        oBtn2.onclick = function(){
            num--;
            oPtxt.style.fontSize=num+&#39;px&#39;;
        }
    }
</script>
登入後複製

相關免費學習推薦:javascript影片教學

以上是javascript如何設定字體大小的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板