作业：
* 描述HTML与HTTP是什么,他们之间有什么联系?
答：HTML是一种通用的便携超文本的标记语言。
HTTP是超文本传输协议。
HTTP用于传输以html超文本标记语言编写的文档。
* 制作一个导航,要求使用到列表,链接,图片,并使用图片做为链接元素。
实例
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>导航</title> </head> <body> <header>头部</header> <main> <nav> <ul> <li><a href="http://www.php.cn"><img src="https://www.php.cn/static/images/index_php_item3.jpg?1" alt="php中文”width="100></a></li> <li><a href="http://www.php.cn"><img src="https://www.php.cn/static/images/index_php_item3.jpg?1" alt="php中文”width="100></a></li> <li><a href="http://www.php.cn"><img src="https://www.php.cn/static/images/index_php_item3.jpg?1" alt="php中文”width="100></a></li> <li><a href="http://www.php.cn"><img src="https://www.php.cn/static/images/index_php_item3.jpg?1" alt="php中文”width="100></a></li> </ul> </nav> </main> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
* 制作一张商品信息表, 要求用到标题, 头部与底部, 行与列方向的合并
(还没写完）
实例
<!DOCTYPE html> <!--注释--> <html lang="en"> <head> <meta charset="utf-8"> <title>商品信息表作业</title> </head> <body> <header> </header> <table border="1"> <thead> <h3>商品信息表</h3> </thead> <tbody> <tr> <td>***</td> <td>型号</td> <td>数量</td> <td>价格</td> </tr> <tr> <td rowspan="2">华为</td> <td>华为mate30</td> <td>1台</td> <td>7000元</td> </tr> <tr> <td>华为mate10</td> <td>1台</td> <td>3000元</td> </tr> <tr> <td>苹果</td> <td>iphone11</td> <td>1台</td> <td>8000元</td> </tr> <tr> <td colspan="2">合计</td> <td>1台</td> <td>8000元</td> </tr> </tbody> </table> </body> </html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
实例* 制作一张完整的用户注册表单, 要求尽可能多的用到学到的表单控件 实例 <!DOCTYPE html><!--注释--> <html lang="en"> <head> <meta charset="utf-8"> <title>表单作业</title> </head> <body> <form action="" method="post" name="zuoye"> <p>用户名：<input type="text" name="username" value="必填" required="required" placeholder="汉字、数字、想、字母、下划线" size="50" maxlength="10"></p> <p>密 码：<input type="password" name="password" value="必填" required="required" placeholder="汉字、数字、想、字母、下划线" size="50" maxlength="10"></p> <p>邮 箱：<input type="email" name="email" value="必填" required="required" placeholder="汉字、数字、想、字母、下划线" size="50" maxlength="10"></p> <p>网 址：<input type="url" name="url" value="必填" required="required" placeholder="汉字、数字、想、字母、下划线" size="50" maxlength="10"></p> <p>电 话：<input type="tel" name="tel" value="必填" required="required" placeholder="汉字、数字、想、字母、下划线" size="50" maxlength="10"></p> <p>性别： <select name="sex"> <option value="male">男</option> <option value="female">女</option> <option value="serctry">保密</option> </select> </p> <p><input type="submit" size="50"></p> </form> </body> </html> 运行实例 »点击 "运行实例" 按钮查看在线实例
* 制作一个网站后面, 要求使用`<iframe>`内联框架实现
* 总结: 为什么推荐使用语义化的标签?