HTML练习 

 1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
 2 <html>
 3 <head>
 4     <meta http-equiv="Content-Type" content="text/html;charset=utf-8">
 5     <title></title>
 6 </head>
 7 <body>
 8     <h1>html课程效果演示</h1>
 9     <br/><br/><br/><br/>
10     <a name="base"></a>
11     <h2>基本标签</h2>
12     &lt;html&gt;&lt;head&&gt;&lt;title&gt;
13     <h1>h1</h1>
14     <h2>h2</h2>
15     <p>
16         鹅鹅鹅，曲项向天歌。<br/>
17         白毛浮绿水，红掌拨清波。
18     </p>
19     <br/><br/><hr/><br/><br/>
20     <h2>列表标签</h2>
21     <ul>
22         <li>蛋蛋</li>
23         <li>建国</li>
24         <li>浇水</li>
25     </ul>
26     <ol>
27         <li>dandan</li>
28         <li>jianguo</li>
29         <li>jiaoshui</li>
30     </ol>
31     <br/><br/><hr/><br/><br/>
32     <a name="effect"></a>
33     <h2>显示效果标签</h2>
34     &lt;small&gt;<small>小号文本</small>
35     &lt;big&gt;<big>大号文本</big>
36     <a name="table"></a>
37     <h2>表格标签</h2>
38     <table width="400px" cellpadding="5px" border="1"
39             cellspacing="0px" style="border-collapse:collapse">
40         <caption>信息统计表</caption>
41         <thead>
42             <tr>
43                 <th>编号</th><th>姓名</th><th>性别</th><th>年龄</th>
44             </tr>
45         </thead>
46         <tbody>
47             <tr><td>1</td><td>dandan</td><td>nan</td><td>18</td></tr>
48             <tr><td>2</td><td>jianguo</td><td>nan</td><td>22</td></tr>
49             <tr><td>3</td><td>laibao</td><td>nan</td><td>55</td></tr>
50             <tr><td>4</td><td>jiaoshui</td><td>nan</td><td>66</td></tr>
51 
52         </tbody>
53         <tfoot>
54             <tr><td colspan="4">合计：4人</td> </tr>
55         </tfoot>
56     </table>
57     <br/><br/><hr/><br/><br/>
58     <a name="img"></a>
59     <h2>图片标签</h2>
60     <img src="人丑就要多读书.jpg">
61     <a name="a"></a>
62     <hr/>
63     <h2>锚标签（超链接标签）</h2>
64     <a href="www.rupeng.com/index.shtml" target="_blank"></a>
65     <div style="position: fixed;top:300px;right:0px ;
66     width: 200px;height:300px;border:solid royalblue;border-width: 1px;">
67         <br/>
68         <a href="#base">基本标签</a><br/>
69         <a href="#effect">显示效果标签</a><br/>
70         <a href="#table">表格标签</a><br/>
71     </div>
72     <h2>表单标签</h2>
73     <br/>
74     <form action="index.html">
75         <lable for="account">账号：</lable><input id="account" name="account" type="text"/><br/>
76         <label for="password">密码：</label><input id="password" name="password" type="password"/><br/>
77         <label>性别：</label>
78         <input type="radio" name="gender" checked="checked" value="man"/>男<br/>
79         <input type="radio" name="gender" value="female"/>女<br/>
80         <label>爱好：</label>
81         <input type="checkbox" name="hobbies" value="read"/>读书
82         <input type="checkbox" name="hobbies" value="music"/>音乐
83         <input type="checkbox" name="hobbies" value="running"/>跑步
84         <br/>
85         <label>学历：</label>
86         <select>
87             <option value="本科">本科</option>
88             <option value="中学">中学</option>
89             <option value="专科">专科</option>
90         </select>
91         <br/>
92         <input type="reset" value="重置"/>
93         <input type="submit" value="注册"/>
94     </form>
95     <br/><br/><br/><br/><br/>
96 </body>
97 </html>

 

posted @ 2018-02-18 11:20  caoDanLife  阅读(109)  评论(0)    收藏  举报