HTML学习小记--No.3

1. 框架

<div id="container" style="width:800px">

        <div id="header" style="background-color:cornflowerblue">
            <h1 style="margin-bottom:auto;">主要的网页标题</h1>
        </div>

        <div id="menu" style="background-color:lightskyblue;height:300px;width:200px;float:left;">
            <b>菜单</b><br>
            HTML<br>
            CSS<br>
            JavaScript
        </div>

        <div id="content" style="background-color:lightblue;height:300px;width:600px;float:left;">
            内容在这里
        </div>

        <div id="footer" style="background-color:lightcoral;clear:both;text-align:center;">
            版权 © Run&Win.com
        </div>
</div>

运行结果

 2. 小窗口显示

<iframe src="demo_iframe.htm" name="iframe_a" frameborder="0">
</iframe>
<p><a href="https://xxx.com" target="iframe_a">显示xxx网</a></p>

 3. JavaScript 触发事件

<script>
     document.write("<h1>title</h1>")
     document.write("<p>paragraph</p>")
</script>
<noscript>sorry,you have no script</noscript>
    <p id="demo">
        JavaScript 可以触发事件，就像按钮点击。
    </p>

<script>
    function myFunction()
    {
	document.getElementById("demo").innerHTML="Hello JavaScript!";
    }
</script>
    <button type="button" onclick="myFunction()">点我</button>

运行结果

点击之后变为