<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <!-- <meta http-equiv="Refresh" content="2;URL=http://www.baidu.com">--> <link rel="icon" href="https://www.w3school.com.cn/ui2019/logo-48-red.png"> <!--浏览器打开头的小图标--> <title>这是第一个html文件</title> <style> span{ color:red;} #div1{ color: red; background: yellow; width:200px; height: 200px; } #div2{ color: red; background: chartreuse; width:200px; height: 200px; } #div3{ color: blue; background: brown; width:200px; height: 200px; } </style> </head> <body> <h1>nihaozhongguoren</h1> <hr/> <!--分割线--> <p>拆功能键前</p><br> <!--块级标签--> <div style="color:red">鸡毛非上瘾</div> <!--块级标签，后面会换行--> <span>这是span标签</span>fdbfdb <!--内联标签，不会换行--> <em>这是em便斜字体</em> <strike>划除标签</strike> <del>这是del化成</del> 2<sub>这是sub标签</sub> <sup>这是sup标签</sup>3 hellow ©<!--版权符号--> < <!--小于符号< --> > <!--大于号> --> <img src="520.jpg" width="400" height="840" alt="图片地址错误" title="大美女哦"> <!--如果没有找到图片就报错alt--> <br/> <b>这是b标签</b> <a href="http://www.baidu.com">baidu.com</a> <!--a标签的两个功能，超链接标签--> <a href="http://www.baidu.com" target="_blank" title="会在新的页码跳转">baidu.com</a> <br/> <div id="div4">首页</div> <a href="#div1">这是第一章</a> <!--锚功能，用来引用下面的div块--> <a href="#div2">这是第二章</a> <a href="#div3">这是第三章</a> <div id="div1">第一章</div><a href="#div4">返回</a> <div id="div2">第二章</div><a href="#div4">返回</a> <!--div块的内容添加在head的style里面--> <div id="div3">第三章</div><a href="#div4">返回</a> <!--非排序列表--> <ul> <li>a</li> <li>b</li> <li>c</li> </ul> <!--有序列表--> <ol> <li>a</li> <li>b</li> <li>c</li> </ol> <dl> <!--定义列表--> <dt>第一张</dt> <dd>数据1</dd> <dd>数据2</dd> <dd>数据3</dd> </dl> <form action="url地址" method="get"> <div>用户:<input type="text" name="username"></div> <div>密码:<input type="password" name="password"></div> <p>爱好:篮球<input type="checkbox" name="hobby" value="100"></p> <p>爱好:足球<input type="checkbox" name="hobby" value="101"></p> <p>男<input type="radio" name="sex1" value="0"></p> <p>女<input type="radio" name="sex1" value="1"></p> <p><input type="file"></p> <!--上传文件--> <p><input type="reset" value="清空内容"></p> <select name="city" size="2"> <optgroup label="中国"> <option value="beijing">北京</option> <option value="tianjing">天津</option> <option value="tianjing">天津1</option> </optgroup> </select> <textarea rows="5">自我简介</textarea> <label for="www">姓名</label> <!--鼠标点击姓名会把光标放在下面text文本中--> <input id="www" type="checkbox"> <table border="1" cellspacing="10%" cellpadding="10%"> <!--画表格--> <tr> <th>年份</th> <th>月份</th> <th>每天</th> <td>dss</td> </tr> <tr> <td>2020年</td> <td>4月</td> <td>5号</td> </tr> </table> <p><input type="submit" value="点击提交"></p> </form> </body> </html>