快速入门

1.新建文本文件,后缀名改为 .html/.htm

2.编写 HTML结构标签

3.在中使用

定义标题字体

4.使用标签定义图片

5.保存后,使用浏览器打开该文件

| 标签 | 描述 |
| ——————— | —————————————————————- | |
| | 定义 HTML 文档 |
| | 定义关于文档的信息 |
| | 定义文档的标题 |<br /> | <body> | 定义文档的主体 |</p> <p><a name="dd5c17fc"></a></p> <h2 id="an2rvi"><a name="an2rvi" class="reference-link"></a><span class="header-link octicon octicon-link"></span>基础标签</h2><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody> <tr> <td><h1> ~ <h6></td> <td>定义标题,h1最大,h6最小</td> </tr> <tr> <td><font></td> <td>定义文本的字体、字体尺寸、字体颜色</td> </tr> <tr> <td><b></td> <td>定义粗体文本</td> </tr> <tr> <td><i></td> <td>定义斜体文本</td> </tr> <tr> <td><u></td> <td>定义文本下划线</td> </tr> <tr> <td><center></td> <td>定义文本居中</td> </tr> <tr> <td><p></td> <td>定义段落</td> </tr> <tr> <td><br></td> <td>定义折行</td> </tr> <tr> <td><hr></td> <td>定义水平线</td> </tr> </tbody> </table> <table> <thead> <tr> <th>HTML 原代码</th> <th>显示结果</th> <th>描述</th> </tr> </thead> <tbody> <tr> <td><</td> <td><</td> <td>小于号或显示标记</td> </tr> <tr> <td>&gt ;</td> <td>></td> <td>大于号或显示标记</td> </tr> <tr> <td>&</td> <td>&</td> <td>可用于显示其它特殊字符</td> </tr> <tr> <td>"</td> <td>“</td> <td>引号</td> </tr> <tr> <td>®</td> <td>®</td> <td>已注册</td> </tr> <tr> <td>©</td> <td>©</td> <td>版权</td> </tr> <tr> <td>™</td> <td>™</td> <td>商标</td> </tr> <tr> <td> </td> <td></td> <td>不断行的空白</td> </tr> </tbody> </table> <p><a name="8b9c64c1"></a></p> <h2 id="5989zu"><a name="5989zu" class="reference-link"></a><span class="header-link octicon octicon-link"></span>图片、音频、视频标签</h2><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody> <tr> <td><img></td> <td>定义图片</td> </tr> <tr> <td><audio></td> <td>定义音频</td> </tr> <tr> <td><video></td> <td>定义视频</td> </tr> </tbody> </table> <ul> <li><p>img:定义图片</p> <ul> <li>src:规定显示图像的 URL</li><li>height:定义图像的高度</li><li>width:定义图像的宽度</li></ul> </li><li><p>audio:定义音频。支持的音频格式:MP3、WAV、OGG</p> <ul> <li>src:规定音频的 URL</li><li>controls:显示播放控件</li></ul> </li><li><p>video:定义视频。支持的音频格式:MP4, WebM、OGG</p> <ul> <li>src:规定视频的 URL</li><li>controls:显示播放控件</li></ul> </li></ul> <p><a name="d30fed72"></a></p> <h3 id="5bfzns"><a name="5bfzns" class="reference-link"></a><span class="header-link octicon octicon-link"></span>超链接标签</h3><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody> <tr> <td><a></td> <td>定义超链接,用于链接到另一个资源</td> </tr> </tbody> </table> <ul> <li>href:指定访问资源的URL</li><li><p>target:指定打开资源的方式</p> <ul> <li><p>_self:默认值,在当前页面打开</p> <ul> <li>_blank:在空白页面打开</li></ul> </li></ul> </li></ul> <p><a name="28bddf00"></a></p> <h3 id="8kmy4j"><a name="8kmy4j" class="reference-link"></a><span class="header-link octicon octicon-link"></span>列表标签</h3><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody> <tr> <td><ol></td> <td>定义有序列表</td> </tr> <tr> <td><ul></td> <td>定义无序列表</td> </tr> <tr> <td><li></td> <td>定义列表项</td> </tr> </tbody> </table> <ul> <li>type:设置符号的类型</li></ul> <p><a name="9c942d88"></a></p> <h3 id="di8ixn"><a name="di8ixn" class="reference-link"></a><span class="header-link octicon octicon-link"></span>表格标签</h3><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody> <tr> <td><table></td> <td>定义表格</td> </tr> <tr> <td><tr></td> <td>定义行</td> </tr> <tr> <td><td></td> <td>定义单元格</td> </tr> <tr> <td><th></td> <td>定义表头单元格</td> </tr> </tbody> </table> <ul> <li>table:设置符号的类型<pre><code>* table:定义表格 * width:宽度 * border:边框 * cellpadding:定义内容和单元格的距离 * cellspacing:定义单元格之间的距离。如果指定为0,则单元格的线会合为一条、 * bgcolor:背景色 * align:对齐方式 * tr:定义行 * bgcolor:背景色 * align:对齐方式 * td:定义单元格 * colspan:合并列 * rowspan:合并行 * th:定义表头单元格 * <caption>:表格标题 </code></pre></li></ul> <p><a name="0e03dfe0"></a></p> <h3 id="5e5ogl"><a name="5e5ogl" class="reference-link"></a><span class="header-link octicon octicon-link"></span>布局标签</h3><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody> <tr> <td><div></td> <td>定义 HTML 文档中的一个区域部分,经常与 CSS 一起使用,用来布局网页</td> </tr> <tr> <td><span></td> <td>用于组合行内元素。</td> </tr> </tbody> </table> <p><a name="ea912bc3"></a></p> <h3 id="8toroq"><a name="8toroq" class="reference-link"></a><span class="header-link octicon octicon-link"></span>表单标签</h3><table> <thead> <tr> <th>标签</th> <th>描述</th> </tr> </thead> <tbody> <tr> <td><form></td> <td>定义表单</td> </tr> <tr> <td><input></td> <td>定义表单项,通过type属性控制输入形式</td> </tr> <tr> <td><label></td> <td>为表单项定义标注</td> </tr> <tr> <td><select></td> <td>定义下拉列表</td> </tr> <tr> <td><option></td> <td>定义下拉列表的列表项</td> </tr> <tr> <td><textarea></td> <td>定义文本域</td> </tr> </tbody> </table> <p><a name="f0e45d6c"></a></p> <h4 id="ggver4"><a name="ggver4" class="reference-link"></a><span class="header-link octicon octicon-link"></span>type取值</h4><table> <thead> <tr> <th>type 取值</th> <th>描述</th> </tr> </thead> <tbody> <tr> <td>text</td> <td>默认值。定义单行的输入字段</td> </tr> <tr> <td>password</td> <td>定义密码字段</td> </tr> <tr> <td>radio</td> <td>定义单选按钮</td> </tr> <tr> <td>checkbox</td> <td>定义复选框</td> </tr> <tr> <td>file</td> <td>定义文件上传按钮</td> </tr> <tr> <td>hidden</td> <td>定义隐藏的输入字段</td> </tr> <tr> <td>submit</td> <td>定义提交按钮,提交按钮会把表单数据发送到服务器</td> </tr> <tr> <td>reset</td> <td>定义重置按钮,重置按钮会清除表单中的所有数据</td> </tr> <tr> <td>button</td> <td>定义可点击按钮</td> </tr> </tbody> </table>