"狂神说-HTML.pdf"
HTML(HyperText Markup Language)是用于创建网页的标准标记语言,它允许开发者通过一系列标签来构建网页结构和内容。以下是对HTML基础知识的详细阐述:
1. **标题标签**: HTML中的标题标签(h1至h6)用于设置网页的各级标题,h1代表最高级别的标题,h6则为最低级别。这些标签有助于搜索引擎理解网页内容的层次结构。
2. **段落标签**: `p`标签用于定义文本段落,它是网页内容的基本组成单元。
3. **换行标签**: `br`标签用于在文本中强制换行,不形成新的段落。
4. **水平线标签**: `hr`标签插入一条水平线,常用于区分页面的不同部分。
5. **字体样式标签**: 包括`em`(强调)、`strong`(加粗)、`i`(斜体)、`b`(粗体,非语义化)、`u`(下划线)等,用于改变文本的显示样式。
6. **注释和特殊符号**: `<!-- -->`用于插入HTML注释,不会在浏览器中显示;特殊符号如版权`©`、注册商标`®`等可以通过实体引用来实现。
7. **网页基本标签**: 网页通常由`<!DOCTYPE>`声明、`<html>`根元素、`<head>`头部信息和`<body>`主体内容组成。`<head>`中包含`<title>`定义页面标题,`<meta>`提供元信息,`<link>`引用外部资源等。
8. **图像标签**: `<img>`用于插入图像,`src`属性指定图像源,可以使用相对或绝对路径,`alt`属性提供替代文本,便于屏幕阅读器和无法加载图像时使用。
9. **链接标签**: `<a>`定义超链接,`href`指定链接目标,`target`属性定义打开链接的方式,如`_self`(当前窗口/标签页)、`_blank`(新窗口/标签页)等。`<a>`还可以用于创建锚点链接,实现页面内部跳转。
10. **列表标签**: 有序列表`<ol>`、无序列表`<ul>`和定义列表`<dl>`用于组织信息。`<li>`标签定义列表项。
11. **表格标签**: `<table>`定义表格,`<tr>`表示行,`<th>`为表头,`<td>`为数据单元格。`<caption>`添加表格标题,`<colgroup>`和`<col>`定义列属性。
12. **媒体标签**: `<video>`用于嵌入视频,支持多种来源、控制和事件处理,例如`src`指定视频源,`controls`显示播放控件。
13. **页面结构分析**: 使用`<header>`、`<nav>`、`<main>`、`<article>`、`<aside>`、`<footer>`等语义化标签,增强页面结构的可读性和可访问性。
14. **iframe内联框架**: `<iframe>`允许在页面中嵌入另一个HTML文档,常用于加载外部内容,如地图、广告或视频。
15. **表单**: 表单通过`<form>`标签创建,`method`属性指定提交方式,如`POST`和`GET`。`<input>`、`<select>`、`<textarea>`等元素用于用户输入。`name`属性定义数据组,单选框需同组名,多选框需不同组名。
16. **文本框、单选框和多选框**: `<input type="text">`创建文本输入框,`type="radio"`定义单选框,`type="checkbox"`定义多选框。
17. **按钮**: `<button>`标签用于创建可点击的按钮,可以触发JavaScript事件或提交表单。
18. **列表文本框、文件域**: `<input type="file">`允许用户选择本地文件,`<datalist>`可以提供预设选项供文本框选择。
19. **搜索框、滑块和验证**: `<input type="search">`创建搜索框,`type="range"`创建滑块,简单的验证可以通过`required`属性实现,更复杂的验证则需要JavaScript配合。
20. **正则表达式验证**: 正则表达式是用于匹配字符串的强大工具,常用于表单验证,如邮箱、电话号码格式等。
21. **div和布局**: `div`标签用于创建区块,通过CSS布局实现页面设计,如浮动、定位和弹性盒模型。
以上知识点构成了HTML基础,学习并熟练掌握这些概念和标签是前端开发的必备技能。了解和使用它们可以构建功能丰富、结构清晰的网页。