快速入门
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>> ;</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>