HTML常用标签
HTML常用标签 <!DOCTYPE html> <!--html 文件开始--> <html lang="en"> <!--head 文件头--> <head> <meta charset="UTF-8"> <title>这是第一个网页</title> </head> <!--body文件体--> <body> <a id="top">顶部锚点</a> <h1>这是一个大标题</h1> <!--换行符--> <br/> <p>段落标签</p> <!--水平分割线--> <hr/> <!-- ../返回上一级标签 --> <img src="../resource/img/1.jpg" alt="QQ头像" title="悬停显示字体" /> <!--链接标签--> <a href="2.链接页面.html" target="_blank"> 点击跳转</a> <!--锚链接标签 实现页面间的跳转--> <a href="#top">回到顶部</a> <!--功能性链接 邮件链接: mailto:</p> --> <a href="mailto:2475624676@qq.com">点击联系我们</a> <!--列表标签 有序列表 无序列表 自定义列表 --> <!--有序列表--> <ol> <li>java</li> <li>c++</li> <li>python</li> <li>php</li> </ol> <hr/> <!--无序列表--> <ul> <li>java</li> <li>c++</li> <li>python</li> <li>php</li> </ul> <!--自定义列表 dl:标签 dt:列表名称 dd:列表内容 --> <dl> <dt>学科</dt> <dd>Java</dd> <dd>python</dd> <dd>c++</dd> </dl> <!--表格标签 行 tr 列 td 跨行 rowspan 跨列 colspan --> <table border="2px"> <tr> <td rowspan="2">1-1</td> <td>1-2</td> <td>1-3</td> <td>1-4</td> </tr> <tr> <td>1-1</td> <td>1-2</td> <td>1-3</td> </tr> <tr> <td colspan="4">1-1</td> </tr> </table> <!--视频标签 controls 控制视频 autoplay 自动播放 --> <video href=" 视频的相对路径" controls autoplay></video> <!--音频标签 controls 控制音频 autoplay 自动播放 --> <audio href="音频的相对路径" controls autoplay></audio> <!--iframe内联框架 src:地址 name:框架标识名 实现在网页里嵌套另一个网页 --> <iframe src="引用页面地址" frameborder="1px"></iframe> <!--form表单语法 隐藏域:hidden 只读:readonly 禁用:disable action: 表单提交的位置 , 可以是网站,也可以是一个请求地址 method : post,get 提交方式 get: 我们可以在url中看到我们提交的信息,不安全,但是高效 post: 比较安全,可以传输大文件 --> <h5>登陆注册</h5> <form action="2.链接页面.html" method="post" > <!-- input标签 type 类型 name 用于JavaWeb获取输入的信息 value="html" 默认初始值 maxlength="7" 默认字符的最大长度,最多能输入几个字符 size="30" 文本框的长度 --> <p> 姓名:<input type="text" name="username"></p> <!-- 单选框radio value : 单选框的值,选择事件,”男“只是用来修饰value的值的 name: 表示组的类别 --> <p> 性别: <input type="radio" value="boy" name="sex" >男 <input type="radio" value="girl" name="sex" >女 </p> <p>密码:<input type="password" name="password"></p> <!--多选框checkbox--> <p> 爱好: <input type="checkbox" value="sleep" name="hobby">睡觉 <input type="checkbox" value="game" name="hobby">游戏 <input type="checkbox" value="chat" name="hobby">聊天 <input type="checkbox" value="shop" name="hobby">购物 </p> <!-- 下拉框 --> <p>地区: <select name="文本选项"> <option value="china">中国</option> <option value="american">美国</option> <option value="UN">英国</option> <option value="faguo">法国</option> <option value="eluosi">俄罗斯</option> </select> </p> <!--文本域textarea--> <p> <textarea name="textarea" rows="10" cols="50">文本内容</textarea> </p> <!--文件域file --> <p> <input type="file" name="files"> <input type="button" value="上传" name="up"> </p> <!--邮箱验证mail--> <p>邮箱: <input type="mail" name="mail"/> </p> <!--URL--> <p> <input type="file" name="url"/> </p> <!--数字 step 每次增加或缩小的值 --> <p>商品数量: <input type="number" name="num" max="100" min="0" step="1"/> </p> <!--滑块range--> <p> <input type="range" name="range"/> </p> <!--搜索search--> <p>搜索: <input type="search" name="search"/> </p> <p> <input type="submit" name="提交"> <input type="reset" name="重置"> </p> </form> </body> </html>