本篇文档是关于前端开发基础知识中HTML的学习笔记,主要涵盖了HTML的基本结构、head标签的作用、文本标签的使用,以及元素类型(块元素与行内元素)的区别。以下是详细的内容概要:
1. **HTML基础简介**:
- HTML(HyperText Markup Language)是一种标记语言,用于创建网页内容结构。
- **文档声明**:`<!DOCTYPE html>` 定义了文档类型,告诉浏览器这是HTML5标准。
2. **基本结构**:
- **`<html>` 标签对**:文档的根节点,包含整个HTML内容。
- **`<head>` 标签对**:存放文档的元数据,如标题、链接、样式表和脚本等。
- **`<title>` 标签**:定义网页的标题,显示在浏览器标签页上。
- **`<meta>` 标签**:提供页面的元信息,如charset(字符集)、keywords(关键字)和description(描述)。
- **`<link>` 标签**:引入外部CSS文件,用于样式管理。
- **`<style>` 标签**:定义内联CSS,直接在HTML中编写样式。
- **`<script>` 标签**:包含或引入JavaScript代码,实现动态功能。
3. **文本处理**:
- **标题标签**:h1~h6,定义不同层级的标题。
- **段落标签**:`<p>`,用于分隔文本。
- **换行标签**:`<br>`,强制换行。
- **文本修饰**:bold(strong/b)、italic(i/em/cite)、superscript(sup)、subscript(sub)、strike(s)、underline(u)、big/small。
- **`<hr>`**:水平线,用于页面分割。
4. **元素类型**:
- **块级元素**:独占一行,如h1~h6、p、div、hr等,可以包含其他元素。
- **行内元素**:如a、span、img等,共存于一行,不能容纳块级元素,但可包含行内元素。
5. **`<div>` 标签**:通用的容器元素,用于组织和布局HTML结构,便于CSS样式应用。
通过这个学习笔记,初学者可以掌握HTML的基础构建方法,理解如何使用各种标签来构建网页结构,并了解元素类型对网页布局的影响。继续深入学习时,会涉及CSS和JavaScript的配合,以实现更丰富的交互效果。