在大学里学习JavaScript,这应该是一个基于框架的样式查看器

时间:2014-04-16 18:10:14

标签: javascript html css viewer

我复制了代码,就像我们应该为这个类一样。该学院使用的书是HTML和JavaScript Basics第4版。我实际上是在上一章的最后一个项目中,无法弄清楚代码有什么问题。它应该通过不同的大小和颜色字体来改变。

我通过JShint.com运行代码,并没有得到任何关于它无效的原因。看看这个网站的所有地方甚至有什么东西可以看看是否有什么可能有帮助,什么都没有。我确定无论它是什么,都很简单,或者很可能发生在书中缺少的东西。

我的java / html代码:

<link href="js25.css" rel="stylesheet" type="text/css"></link>
<script type="text/javascript">
    /* <![CDATA[ */
    var index = 0;

    function stylize() {
        index++;
        if (index > 7) index = 1;
        var s = "myStyle" + index;
        var e = document.getElementById("MessageText");
        e.className = s;
        setTimeout("stylize()", 1500);
        return;
    }

    /* ]]> */
</script>
</head>
<body onload="stylize()">
    <table align="center" border="1" style="border-color:black">
        <tr>
            <td align="center">
                <font size="3"><b>STYLE CLASS VIEWER</b></font>
            </td>
        </tr>
        <tr>
            <td align="center" height="100" width="400">
                <div id="MessageText" class="myStyle1">
                    Hello World Wide Web!!
                </div>
            </td>
        </tr>
    </table>
</body>

这是我的css代码:

.myStyle1 {
    color: black;
    font-size: 12;
}

.myStyle2 {
    color: black;
    font-size: 18;
}

.myStyle3 {
    color: black;
    font-size: 24;
}

.myStyle4 {
    color: black;
    font-size: 30;
}

.myStyle5 {
    color: black;
    font-size: 30;
}

.myStyle6 {
    color: black;
    font-size: 30;
}

.myStyle7 {
    color: black;
    font-size: 30;
}

1 个答案:

答案 0 :(得分:2)

你的JavaScript看起来不错,好像你的问题在于CSS。您需要在字体大小上添加“px”。

.myStyle1 {color:black; font-size:12px}
.myStyle2 {color:black; font-size:18px}
.myStyle3 {color:black; font-size:24px}