web前端开发技术储久良第三版第5章练习与实验答案

web前端开发技术储久良第三版答案整理(1-9章)

练习5
1.选择题
(1) D (2) C (3) B (4) C (5) B (6) A (7)B

2.填空题
(1) href="mailto:someone@mail.com"
(2) name、“#target1”
(3) 绝对路径、相对路径、根路径。相对、根路径,绝对。
(4) <a href="http://www.edu.cn" target="leftframe">中国教育网</a>
3.问答题
见教材。

实验5
1.代码 实验5-1演示

<!--exp_5_1.html 实验5-1-->
<!doctype html>
<html lang="en">
 <head>
  <meta charset="UTF-8">
        <title>apple网站</title>
        <style type="text/css">
            ul{list-style-type:none;margin:0 auto;}
            li{float:left;padding:10px; }
            img{width:200px;height:150px;}
            hr{clear:both;}
        </style>
    </head>
    <body>
    <h2 align="center">apple网站</h2>
    <hr size="3" color="#66ff33">
    <ul>
        <li><a href="http://www.apple.com.cn/iphone/"><img src="ipadblank1.gif" ></a></li>
        <li><a href="http://www.apple.com.cn/iphone/"><img src="ipadblank2.gif"></a></li>
        <li><a href="http://www.apple.com.cn/macbook-pro/"><img src="ipadblank3.gif" ></a></li>
        <li><a href="http://www.apple.com.cn/supplierresponsibility/"><img src="ipadblank4.gif"></a></li>
    </ul>
   <hr size="3" color="#66ff33">
    </body>

2.代码 实验5-2演示

<!-- exp_5_2.html -->
<!doctype html>
<html lang="en">
    <head>
        <meta charset="UTF-8">   
        <title>桂林山水风景图片</title>
        <style type="text/css">    
            img{width:100px;height:100px;border:0;}    
            h3{color:#ff0000;}
            ul{list-style-type:none;text-align:center;}
            li{display:inline;width:120px;line-height:30px;}
        </style>
    </head>
    <body>
        <h3 align="center" >桂林山水风景图片</h3> 
        <ul>
            <li><a href="image51.jpg" target="_top"><img src="image51.jpg" alt=""><br>桂林山水1<br></a></li>
            <li><a href="image52.jpg"><img src="image52.jpg" alt=""><br>桂林山水2<br></a></li>
            <li><a href="image53.jpg"><img src="image53.jpg" alt=""><br>桂林山水3<br></a></li>
            <li><a href="image54.jpg"><img src="image54.jpg" alt=""><br>桂林山水4<br></a></li>
        </ul>
    </body>
</html>

3.代码 实验5-3演示

<!-- exp_5_3.html -->
<!doctype html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8">
        <title>浮动框架应用</title>
        <style type="text/css">
            body{ text-align:center; }
            iframe{width:350px;height:250px;}
        </style>
    </head>
    <body>
        <h3>浮动框架中打开新页面</h3>
        <iframe src="http://www.pku.edu.cn" name="left"></iframe>
        <iframe src="http://www.seu.edu.cn" name="right"></iframe>
        <br>
        <a href="http://www.baidu.com" target="left">在左边浮动框架中打开百度</a>
        <a href="http://www.qq.com" target="right">在右边浮动框架中打开腾讯</a>
    </body>
</html>
版权声明

弈心博客


首发 弈心博客,转载请附链接!

赞赏支持

感谢支持!


建站不易,感谢支持!

推荐阅读