HTML 指南
HTML 指南
HTML(HyperText Markup Language,超文本标记语言)是一种构建网页的标准语言,结合CSS和JavaScript可以创建出美观、动态的网页。本文将介绍HTML的基础概念、标签用法及注意事项。
基础概念
标签
HTML文档由一系列标签(tag)构成,标签通常具有起始标记和结束标记,如<p>
为起始标记,</p>
为结束标记。
元素
元素由起始标签、属性、内容(可选)和结束标签构成。如<img src="xxx.jpg" alt="图片">
中,img
是元素,src
和alt
是属性,"xxx.jpg"
和"图片"
是内容。
属性
元素的属性用于描述元素的特性,如<div class="container">
中,class
是属性,"container"
是属性值。
DOCTYPE
DOCTYPE用于声明HTML文档类型,告诉浏览器应该以什么标准解析HTML文档。标准格式为<!DOCTYPE html>
。
常用标签
标题标签
标题标签用于设置网页标题,根据重要程度从<h1>
到<h6>
逐渐减小。
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<h4>四级标题</h4>
<h5>五级标题</h5>
<h6>六级标题</h6>
段落标签
段落标签用于包裹一段文本内容,以便进行样式控制。
<p>这是一个段落。</p>
图片标签
图片标签用于插入图片,其中src
属性表示图片地址,alt
属性表示图片未加载时给用户的替代文本。
<img src="xxx.jpg" alt="图片">
超链接标签
超链接标签用于在网页中插入可点选的链接,其中href
属性表示链接目的地。
<a href="https://www.baidu.com">百度一下,你就知道</a>
列表标签
列表标签用于创建有序或无序列表,分别使用<ol>
和<ul>
表示有序和无序列表,使用<li>
表示每个列表项。
<ul>
<li>无序列表项1</li>
<li>无序列表项2</li>
</ul>
<ol>
<li>有序列表项1</li>
<li>有序列表项2</li>
</ol>
表格标签
表格标签用于创建表格,使用<table>
表示整个表格,使用<tr>
表示每一行,使用<td>
表示每个单元格,使用<th>
表示表头单元格。
<table>
<tr>
<th>表头1</th>
<th>表头2</th>
</tr>
<tr>
<td>行1,列1</td>
<td>行1,列2</td>
</tr>
<tr>
<td>行2,列1</td>
<td>行2,列2</td>
</tr>
</table>
注意事项
- 标签应正确嵌套,不可交叉使用。
- 属性名不区分大小写,但建议使用小写,属性值必须加引号。
- 空标签无需结束标记,如
<img>
、<br>
等。 - 大部分浏览器已经默认了一些样式,需要通过CSS重置才能达到自己想要的效果。
- 外部文档尽量使用UTF-8编码,以支持各种字符和多语言。
- 一般的HTML文档应该包含文档类型声明、HTML标签、HEAD标签和BODY标签。
以上是HTML指南的基础内容。掌握了基本语法和常用标签,即可快速上手编写网页。在实际应用中还需结合CSS和JavaScript进行样式和交互控制。