有序列表、无序列表、定义列表、a标签、图片标签、视频标签、表格标签、表单标签

实例

<!DOCTYPEhtml><htmllang="en"><head><metacharset="UTF-8"><metahttp-equiv="X-UA-Compatible"content="IE=edge"><metaname="viewport"content="width=device-width,initial-scale=1.0"><title>Document</title><style>tbodytr:hover{background-color:darkgray;}</style></head><body><h2>有序列表</h2><ol><li>多喝水</li><li>多运动</li><li>多补充能量</li><li>多学习</li></ol><h2>无序列表</h2><ul><li>少玩手机</li><li>少玩游戏</li><li>少做无意义的事</li><li>少浪费时间</li></ul><hr><h2>定义列表</h2><dl><dt>关于我们</dt><dd>联系我们</dd><dd>公司实力</dd></dl><hr><ahref="http://www.baidu.com/"target="_blank">我的网站</a><ahref="www.baidu.com">非正规写法</a><!--相对路径--><ahref="./markdown.md">第一天的作业markdown简单写法</a><hr><!--多媒体标签--><h2>图片标签</h2><imgsrc="./images/jiankou.webp"alt="五一爬箭扣"title="五一游玩爬箭扣"width="500px"><h2>视频标签</h2><videosrc="./vidio/video.mp4"controls="controls"height="500px"poster="./images/u.webp"></video><h2>进度标签</h2><progressmin="1"max="100"value="50"></progress><h2>meter标签</h2><metervalue="3"min="0"max="10">密码强度</meter><metervalue="20"min="0"max="100"low="30"high="80"optimum="100"></meter>><h2>表格标签</h2><tableborder="1"width="800px"align="center"cellspacing="0"cellpadding="10"><caption><h3>自我介绍</h3></caption><tr><tdwidth="15%">姓名</td><tdwidth="25%"align="center">陈桥驿</td><tdwidth="10%">性别</td><tdwidth="30%"align="right">男</td><tdwidth="20%"rowspan="2"><imgsrc="./images/jiankou.webp"alt=""width="80px"></td></tr><tr><td>电话</td><td></td><td>年龄</td><td></td><!--<td>照片</td>--></tr><tr><td>自我介绍</td><tdcolspan="4"bgcolor="blue"></td><!--<td></td><td></td><td></td>--></tr><tr><td>项目介绍</td><tdcolspan="4"></td><!--<td></td><td></td><td></td>--></tr></table><hr><tableborder="1"width="800px"align="center"cellspacing="0"><caption><h3>会员表</h3></caption><thead><tr><th>编号</th><th>会员名称</th><th>性别</th></tr></thead><tbody><tr><td>1</td><td>陈桥驿</td><td>男</td></tr><tr><td>1</td><td>陈桥驿</td><td>男</td></tr><tr><td>1</td><td>陈桥驿</td><td>男</td></tr><tr><td>1</td><td>陈桥驿</td><td>男</td></tr></tbody><tfoot><tr><tdcolspan="3"align="right"><ahref="#">首页</a><ahref="#">上一页</a><ahref="#">下一页</a><ahref="#">末页</a></td><!--<td></td><td>1</td>--></tr></tfoot></table><hr><h2>表单</h2><formaction=""method="get">用户名：<inputtype="text"name="username"placeholder="请输入用户名"au><br>密码：<inputtype="password"name="password"placeholder="数字+字组组合"><br><inputtype="radio"name="sex"value="nan"id="nan"checked><labelfor="nan">男</label><inputtype="radio"name="sex"value="nv"id="nv"><labelfor="nv">女</label><inputtype="radio"name="sex"value="baomi"id="baomi"><labelfor="baomi">保密</label><br><inputtype="checkbox"name="xingqu[kanshu]"value=""id="kanshu"><labelfor="kanshu">看书</label><inputtype="checkbox"name="xingqu[play]"value=""id="play"><labelfor="play">玩游戏</label><inputtype="checkbox"name="xingqu[zi]"value=""id="zi"><labelfor="zi">码字</label><inputtype="checkbox"name="xingqu[yundong]"value=""id="yundong"checked><labelfor="yundong">健身运动</label><br><inputtype="file"name="file"><br><inputtype="reset"name=""value="重置按钮"><inputtype="button"name=""value="按钮"><button>提交按钮</button><buttontype="submit">提交按钮</button><buttontype="button">提交按钮</button><inputtype="submit"value="提交"><hr><textareaname="jianyi"id=""cols="60"rows="10"></textarea><br><selectname=""id=""><optionvalue="">初中</option><optionvalue="">高中</option><optionvalue="">技校</option><optionvalue=""selected>大专</option><optionvalue="">本科</option></select></form></body></html>
运行实例 »
点击 "运行实例" 按钮查看在线实例
实例

更多相关文章

随机推荐
