渡课课堂总结（7.30）

最新推荐文章于 2024-07-31 00:06:53 发布

HACKER6666

最新推荐文章于 2024-07-31 00:06:53 发布

阅读量164

点赞数

分类专栏：学习总结

本文链接：https://blog.csdn.net/weixin_42623761/article/details/81291491

版权

学习总结专栏收录该内容

23 篇文章 0 订阅

订阅专栏

今日学习内容

继续深化学习 JavaScript 编程语言中变量、数据类型、运算符、流程控制语句、函数的关联；
思维导图的使用

下午代码练习

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            .cc {
                margin: 0 auto;
                width: 200px;
                height: 200px;
                background: grey;
            }
            .cc p {
                text-align: center;
                height: 200px;
                color: white;
            }
        </style>
    </head>
    <body>
        <p id="cf"></p>
        <hr>
        <div class="cc">
            <p>
                <span id="content">TUZ</span>
            </p>
        </div>
        <hr>
        <select id="fs" onchange="changeSize();">
        </select>
        <script type="text/javascript">
            var cf = function() {
                var cfHtml = "";
                document.getElementById("cf").innerHTML = cfHtml;
            }
            var initFsSelect = function() {
                var fsHtml = "";
                for (var i = 1; i <= 100; i++) {
                    fsHtml += "<option value='"+i+"px'>"+i+"px</option>"
                }
                document.getElementById("fs").innerHTML = fsHtml;
            }
            var changeSize = function() {
                var fs = document.getElementById("fs").value;
                document.getElementById("content").style.fontSize = fs;
            }
            initFsSelect();
        </script>
    </body>
</html>