实例1(文字的放大缩小)

最新推荐文章于 2022-07-06 14:16:48 发布

xiaozhen0610

最新推荐文章于 2022-07-06 14:16:48 发布

阅读量286

点赞数

分类专栏：前端

原文链接：https://www.mk2048.com/blog/blog_hjkhaaib01ib.html

版权

前端专栏收录该内容

844 篇文章 0 订阅

订阅专栏

1.点击减小按钮，文字变小

2.点击增加按钮，文字变大

<!DOCTYPE HTML>
<html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>无标题文档</title>
    <script>
        window.onload = function (){
        var oBtn1 = document.getElementById('btn1');
        var oBtn2 = document.getElementById('btn2');
        var oP = document.getElementById('p1');
        var num = 14;
    
        oBtn1.onclick = function (){
            num -= 2;
        oP.style.fontSize = num + 'px';
        // JS 不允许出现"-"
        // padding-top        paddingTop
        // margin-left        marginLeft
        };
        oBtn2.onclick = function (){
        // num = num + 2;
        num += 2;
        
        oP.style.fontSize = num + 'px';
        // JS 不允许出现“-“
        };
    };
    </script>
    </head>

<body>

示例代码

xiaozhen0610

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
实例1(文字的放大缩小)

1.点击减小按钮，文字变小2.点击增加按钮，文字变大<!DOCTYPE HTML><html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>无标题文档</title> <script> window.onload = function (){ .
复制链接

扫一扫