1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>abbr元素的使用</title> 5 <meta charset="utf-8"> 6 <meta name = "author" content = "王思怡"> 7 </head> 8 <body> 9 <p><abbr title="笑死我了">xswl</abbr> 真有意思</p> 10 </body> 11 </html>
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <title>address元素的使用</title> 5 <meta charset="utf-8"> 6 <meta name = "author" content = "王思怡"> 7 </head> 8 <body> 9 <address> 10 <p>联系方式</p> 11 <p>网页：<a href="http://www.baidu.com">www.baidu.com</a></p> 12 <p>QQ:1437631334</p> 13 <p>WeChat:sucker__9</p> 14 </address> 15 </body> 16 </html>
1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <title>加粗，倾斜的使用</title> 6 <meta charset="utf-8"> 7 <meta name="author" content="王思怡"> 8 </head> 9 10 <body> 11 <strong><p>strong加粗</p></strong> 12 <b><p>b加粗</p></b> 13 <em><p>em倾斜</p></em> 14 <i><p>p倾斜</p></i> 15 </body> 16 17 </html>
1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <title>表格的使用</title> 6 <meta charset="utf-8"> 7 <meta name="author" content="王思怡"> 8 <style> 9 body { 10 background: pink; 11 } 12 13 table { 14 border: 1px solid red; 15 border-collapse: collapse; 16 padding: 5px; 17 } 18 19 caption { 20 color: brown; 21 font: 200; 22 } 23 24 thead th { 25 border: 1px solid blue; 26 background: gray; 27 color: white; 28 } 29 30 tbody th { 31 border: 1px solid blue; 32 background: lightgray; 33 color: white; 34 } 35 36 td { 37 border: 1px solid green; 38 } 39 40 caption { 41 padding: 10px; 42 } 43 </style> 44 </head> 45 46 <body> 47 <table> 48 <caption>信息表</caption> 49 <thead> 50 <tr> 51 <th>姓名</th> 52 <th>年龄</th> 53 <th>联系方式</th> 54 </tr> 55 </thead> 56 <tbody> 57 <tr> 58 <th>王思怡</th> 59 <td>18</td> 60 <td>17670743333</td> 61 </tr> 62 <tr> 63 <th>李伟</th> 64 <td>19</td> 65 <td>13942022933</td> 66 </tr> 67 <tr> 68 <th>王力</th> 69 <td>17</td> 70 <td>19938433347</td> 71 </tr> 72 </tbody> 73 </table> 74 </body> 75 76 </html>
1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <title>表单</title> 6 <meta charset="utf-8"> 7 <meta name="author" content="王思怡"> 8 <style> 9 body { 10 background: pink; 11 } 12 </style> 13 </head> 14 15 <body> 16 <form> 17 姓名：<input type="text" name="name"> <br/><br/> 18 学号：<input type="text" name="id"> <br/><br/> 19 </form> 20 <button type="submit">提交</button> 21 </body> 22 23 </html>
1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <title>登录</title> 6 <meta charset="utf-8"> 7 <meta name="author" content="王思怡"> 8 <style> 9 body { 10 background: pink; 11 } 12 </style> 13 </head> 14 15 <body> 16 <form method="post"> 17 帐号:<input type="text" name="accounts"><br/><br/> 密码: 18 <input type="passwor>d" name="password"><br/><br/> 19 <button type="submit">登录</button> 20 </form> 21 </body> 22 23 </html>
1 <!DOCTYPE html> 2 <html> 3 4 <head> 5 <title>下拉框</title> 6 <meta charset="utf-8"> 7 <meta name="author" content="王思怡"> 8 <style> 9 body { 10 background: pink; 11 } 12 </style> 13 14 <body> 15 <form method> 16 <label>姓名:<input type = "text" name = "name"></label><br/><br/> 17 <label>性别: 18 <select name = "sex"> 19 <option value = "male">男</option> 20 <option value = "famale">女</option> 21 </select></label><br/><br/> 22 <label>联系方式:<input type = "text" name = "tel"></label><br/><br/> 23 <button type="submit">提交</button> 24 <button type="reset">重置</button> 25 </form> 26 </body> 27 </head> 28 29 </html>
