基本格式
<html><head><meta charset='utf-8'><title>网页标题</title></head><body></body>
</html>
文本标签
标题标签：＜h1＞标题＜/h1＞
段落标签：＜p＞段落文本＜/p＞
普通文本标签：＜span＞特殊文本处理＜/span＞
普通文本标签：＜label＞常与表单控件结合使用＜/label＞
加粗标签：＜b＞加粗标签＜/b＞
斜体标签：＜i＞斜体＜/i＞
删除线标签：＜u＞删除线＜/u＞
换行：＜br＞
水平线：＜hr＞
字符实体：使用 < 在页面中呈现 "<"使用 > 在页面中呈现 ">"使用 在页面中呈现一个空格使用 © 在页面中呈现版权符号"©"使用 ¥ 在页面中呈现人民币符号"¥"
容器标签：
<div id="top">页面顶部区域</div>
<div id="main">页面主体区域</div>
<div id="bottom">页面底部区域</div>
图片与超链接标签
<img src="" width="" height="" title="" alt=""><!--用户可以点击超链接,跳转至其他的资源文件-->
<!--默认在当前窗口打开资源文件-->
<!--href属性必填,用于指定链接地址,网络路径必须写协议,target属性选填,用于设置目标文件的打开方式,默认在当前窗口打开,可以设置新建窗口打开(_blank)--><a href="html02.html">跳转</a><a href="www.baidu">百度01</a><a href="" target="_blank">淘宝</a><!--图片超链接--><a href="html02.html" target="_blank"><img src="07.gif" alt=""></a><!--href的特殊取值--><!--href直接写空，表示刷新，并不会跳转--><a href="">href=""</a><!--href写'#'，表示锚点，链接至本页,不会造成刷新,会修改url--><a href="#5">href="#"</a><!--锚点链接，用于长页面中 目录的跳转--><!--<a href="#5">锚点链接</a>--><!--<a name="5"></a>--><!--阻止超链接默认的点击跳转功能，允许自定义点击事件 比如商品数量的加减--><a href="javascript:void(0)">javascript:void(0)</a>
有序列表和无序列表
<!--有序列表，默认阿拉伯数字-->
<!--type属性：'ａ','A','i','I'-->
<ol type="I"><li>list item01</li><li>list item02</li><li>list item03</li>
</ol>
<!--无序列表,默认以实心圆点标识列表项-->
<!--type属性：circle(空心圆),square(实心方块),none(取消项目符号)-->
<ul type="square"><li>unordered list01</li><ol type="1"><li>嵌套01</li><li>嵌套02</li></ol><li>unordered list02</li><li>unordered list03</li><li>unordered list04</li>
</ul>
<ul><li>《西厢记》</li><!--平级嵌套 不适合做网页交互--><li>《金瓶梅》</li><ol type="a"><li>金儿</li><li>瓶儿</li><li>梅儿</li></ol><li>《石头记》</li><li>《玉蒲团》</li>
</ul>
<hr>
<ul><li>《西厢记》</li><!--父子嵌套 方便做网页交互,比如下拉菜单--><li>《金瓶梅》<ol type="a"><li>金儿</li><li>瓶儿</li><li>梅儿</li></ol></li><li>《石头记》</li><li>《玉蒲团》</li>
</ul>
表格
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>表格</title>
</head>
<body><!--表格由结构化的行和单元格组成的,用于数据的展示或者辅助排版--><table border="2px" width="200px" height="300px"><!--table row 表格中的行--><tr><!--table head 表头单元格 自带加粗和居中效果--><th>姓名</th><th>年龄</th><th>成绩</th></tr><tr><!--table data 普通单元格--><td>老七</td><td>30</td><td>A</td></tr><tr><!--table data 普通单元格--><td>老八</td><td>28</td><td>A+</td></tr></table><!--单元格合并,为单元格添加属性colspan:跨列合并,删除被合并的单元格,保证表格完整rowspan:跨行合并,删除被合并的单元格,保证表格完整取无单位的数值,表示包含自身在内合并几个单元格--><table border="1px" width="300px" height="300px"><tr><td colspan="2">示例01</td><!--<td>示例02</td>--><td>示例03</td></tr><tr><td rowspan="2">示例01</td><td>示例02</td><td>示例03</td></tr><tr><!--<td>示例01</td>--><td>示例02</td><td>示例03</td></tr></table><!--表格行分组标签 可以将表格中的若干行划分为一组,表示表头,表尾和表格主体默认情况下,所有的行都会自动添加到tbody(表格主体)中显示--><table border="5px" width="400px" height="400px"><!--thead划分表头--><thead><tr><td>姓名</td><td>成绩</td><th>备注</th></tr></thead><!--tfoot表尾行分组--><tfoot><tr><td colspan="2">合计：</td></tr></tfoot><!--tbody表格主体--><tbody><tr><td>老六</td><td>B</td></tr><tr><td>老五</td><td>B+</td></tr></tbody></table>
</body>
</html>
本文发布于:2024-01-28 20:27:34，感谢您对本站的认可！
本文链接：https://www.4u4v.net/it/170644485710070.html
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系，我们将在24小时内删除。
| 留言与评论（共有 0 条评论） |
