HTML(超文本标记语言)是一种用于创建和设计网页的标准标记语言。HTML 的核心原理是使用一组预定义的“标签”(或“元素”)来定义页面的结构、内容和样式。这些标签可以指示浏览器如何渲染文本、图片、列表、链接等元素,从而构建出一个可视化的、互动的网页。
一、HTML 结构及元素
1. DOCTYPE 声明:HTML 文档的首行必须包含一个 DOCTYPE 声明,用于告诉浏览器文档的 HTML 版本。如, 表示 HTML5 版本。
2. 根元素:每个 HTML 文档都有一个根元素,即 标签。所有其他元素都嵌套在此标签中。
3. 页面结构:一个典型的 HTML 页面分为两部分,
和 。头部 () 包含元数据,如标题、字符集等,这部分内容不会在浏览器中直接显示。而主体部分 () 包含实际显示在浏览器中的内容,如文本、图片、链接等。4. 常用元素:
- 标题:
至 分为六个层级,表示标题的重要性。
- 段落:
用于定义段落。
- 文本样式: 粗体、 斜体、 下划线、 删除线等。
- 列表:无序列表
- 和有序列表
- 。
- 超链接: 用于创建链接,其 href 属性为目标地址。
- 图片:
标签用于插入图片,src 属性为图片路径。
- 表格:
标签定义表格,
表示表格行, 表示单元格。 二、HTML 语法规则及注意事项
1. 标签成对出现:大多数 HTML 标签需要使用开始标签和结束标签包围内容,如
...
。一些特殊标签如和
无需结束标签。2. 标签属性:某些标签需要添加属性以提供更多信息或设置相关样式。例如, 标签的 href 属性用于指定链接的目标地址,
标签的 src 属性用于设定图片路径。
3. 大小写不敏感:HTML 标签及属性名称不区分大小写,但建议使用小写,以保持一致性和可读性。
4. 注释:可以使用 添加注释,不会在浏览器中显示。
5. 特殊字符:HTML 使用一些特殊字符来表示其他字符或格式,如 < 表示 <,& 表示 &。
三、HTML 编辑器
编辑 HTML 文档不需要特殊软件,只需使用简单的文本编辑器(如 Notepad++、Sublime Text、Visual Studio Code 等)即可创建并编辑。保存时,将文件扩展名设置为 .html 或 .htm,双击文件即可用浏览器打开查看。
四、与 CSS 和 JavaScript 的结合
1. CSS:CSS(层叠样式表)可用于设定 HTML 元素的样式,如颜色、字体、边距等。可以通过内部样式表、外部样式表或内联样式的形式将 CSS 应用到 HTML 中。
2. JavaScript:HTML 可与 JavaScript 结合,实现更丰富的交互功能和动态效果。可以使用
- ,列表项