javascript简单的应用

最新推荐文章于 2022-04-18 22:03:00 发布

yzj977

最新推荐文章于 2022-04-18 22:03:00 发布

阅读量188

点赞数

分类专栏： JavaScript 前端文章标签： javascript html js dom 游戏

本文链接：https://blog.csdn.net/yzj977/article/details/107363781

版权

实例一：使用按钮控制网页文字大小

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>index</title>
    <style>
        *{
            text-align: center;
        }
        p{
            margin-left: 10%;
            margin-right: 10%;
        }
    </style>
</head>
<body>
    <div>
        <!--h、div、p标签-->
        <h1 id="title">诗歌鉴赏</h1>
        <div id="word">
            金樽清酒斗十千，玉盘珍馐直万钱。<br/>
            停杯投箸不能食，拔剑四顾心茫然。<br/>
            欲渡黄河冰塞川，将登太行雪满山。<br/>
            闲来垂钓坐溪上，忽复乘舟梦日边。<br/>
            行路难，行路难，多歧路，今安在。<br/>
            长风破浪会有时，直挂云帆济沧海。<br/><br/>

            <b>注解</b><br/>
            １、珍馐：名贵的菜肴。<br/>
            ２、垂钓坐溪上：传说吕尚未遇周文王时，曾在溪（今陕西宝鸡市东南）垂钓。<br/>
            ３、乘舟梦日边：传说伊尹见汤以前，梦乘舟过日月之边。合用这两句典故，是比喻人生遇合无常，多出于偶然。<br/><br/>

            <b>译文</b><br/>
            <p>
                金杯里装的名酒，每斗要价十千；
                玉盘中盛的精美肴菜，收费万钱。
                胸中郁闷呵，我停杯投箸吃不下；
                拔剑环顾四周，我心里委实茫然。
                想渡黄河，冰雪堵塞了这条大川；
                要登太行，莽莽的风雪早已封山。
                象吕尚垂钓溪，闲待东山再起；
                又象伊尹做梦，他乘船经过日边。
                世上行路呵多么艰难，多么艰难；
                眼前歧路这么多，我该向北向南？
                相信总有一天，能乘长风破万里浪；
                高高挂起云帆，在沧海中勇往直前！
            </p>
        </div>
    </div>
    <span>
        <button onclick="makeSmall()">小</button>
        <button onclick="makeNormal()">普通</button>
        <button onclick="makeBig()">大</button>
    </span>

    <script> 
    //获取元素对其使用js方法
        function makeBig()  //变大
        { 
            document.getElementById("word").style.fontSize="larger";
            document.getElementById("title").style.fontSize="32px";
        } 

        function makeNormal()   //普通大小
        { 
            document.getElementById("word").style.fontSize="medium";
            document.getElementById("title").style.fontSize="24px";
        } 

        function makeSmall()    //变

最低0.47元/天解锁文章

yzj977

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
javascript简单的应用

实例一：使用按钮控制网页文字大小<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge">
复制链接

扫一扫