第一部分：HTML基础
HTML文档通常由以下几个部分组成：
-
<!DOCTYPE html>声明：这个声明告诉浏览器你使用的是HTML5标准。 -
<html>元素：这是HTML文档的根元素，包含了整个文档的内容。 -
<head>元素：包含了文档的元信息，如标题、字符编码等。示例：<!DOCTYPE html> <html> <head><meta charset="UTF-8"><title>我的网页</title> </head> <body><!-- 这里是网页的主要内容 --> </body> </html> -
<title>元素：定义网页的标题，显示在浏览器标签栏上。 -
<meta>元素：定义文档的字符编码等元信息。 -
<body>元素：包含实际显示在网页上的内容。
第二部分：HTML元素
HTML包括许多不同类型的元素，用于组织和呈现内容。以下是一些常见的HTML元素：
1.文本元素：
<p>：定义段落。<h1>,<h2>,<h3>等：定义标题，1级标题最高。<a>：创建超链接。<strong>：定义强调文本。<em>：定义斜体文本。
示例：
<p>这是一个段落。</p>
<h1>这是一级标题</h1>
<a href="https://www.example.com">点击这里</a>访问示例网站。
<strong>重要的文本</strong>
2.列表元素
<ul>：无序列表。<ol>：有序列表。<li>：列表项。
示例：
<ul><li>苹果</li><li>香蕉</li><li>橙子</li>
</ul><ol><li>第一步</li><li>第二步</li><li>第三步</li>
</ol>3.图像元素
<img>：插入图像。
<img src="image.jpg" alt="图片描述">
4.表格元素
<table>：创建表格。<tr>：定义表格行。<td>：定义表格数据单元格。
示例：
<table><tr><td>姓名</td><td>年龄</td></tr><tr><td>张三</td><td>25</td></tr>
</table>
第三部分：HTML表单
HTML表单允许用户输入数据并将其提交给服务器。以下是HTML表单的基本元素和示例：
1.<form> 元素：定义一个表单，包含用户输入的元素。
示例：
<form action="/submit" method="post"><!-- 这里是表单内容 -->
</form>
2.<input> 元素：用于接受用户输入的文本、密码、单选按钮等。
示例：
<input type="text" name="username" placeholder="用户名">
<input type="password" name="password" placeholder="密码">
<input type="radio" name="gender" value="male"> 男性
<input type="radio" name="gender" value="female"> 女性
3.<textarea> 元素：用于多行文本输入。
示例：
<textarea name="comments" rows="4" cols="50">在这里输入评论...</textarea>
4.<select> 和 <option> 元素：创建下拉列表。
示例：
<select name="country"><option value="us">美国</option><option value="ca">加拿大</option><option value="uk">英国</option>
</select>
5.<button> 元素：创建按钮，用于提交表单或执行其他操作。
示例：
<button type="submit">提交</button>
<button type="reset">重置</button>
第四部分：HTML嵌套与结构
HTML允许你嵌套元素以创建复杂的结构。以下是一些示例：
1.嵌套列表
<ul><li>水果<ul><li>苹果</li><li>香蕉</li></ul></li><li>蔬菜<ul><li>胡萝卜</li><li>西兰花</li></ul></li>
</ul>
2.嵌套标题
<h1>主标题</h1>
<h2>副标题1</h2>
<h2>副标题2</h2>
3.嵌套表格
<table><tr><td>姓名</td><td>年龄</td></tr><tr><td>张三</td><td>25</td></tr>
</table>
第五部分：HTML注释
HTML注释用于在代码中添加注解，不会在页面上显示。示例如下：
<!-- 这是一个注释 -->
<p>这是一个段落。</p>
第六部分：HTML链接与媒体
HTML还支持创建链接到其他网页、文件或嵌入多媒体内容的功能：
1.超链接(<a>)：用于创建链接到其他页面。
<a href="https://www.example.com">访问示例网站</a>
2.图像(<img>)：用于嵌入图像。
示例：
<img src="image.jpg" alt="图片描述">
3.视频和音频 (<video> 和 <audio>)：用于嵌入多媒体内容。
示例：
<video controls><source src="video.mp4" type="video/mp4">
</video><audio controls><source src="audio.mp3" type="audio/mpeg">
</audio>
第七部分：HTML元素属性
HTML元素可以拥有属性，这些属性提供了有关元素的附加信息。以下是一些常见的HTML元素属性：
1.id 属性：用于唯一标识页面上的元素。
示例：
<p id="unique-paragraph">这是一个唯一的段落。</p>
2.class 属性：用于为一个或多个元素定义类别，可以用于样式化元素。
示例：
<p class="important-text">这是一个重要的文本段落。</p>
3.src 属性：用于指定图像、音频或视频等外部资源的路径。
示例：
<img src="image.jpg" alt="图片描述">
4.alt 属性：提供对图像的替代文本，对于可访问性很重要。
示例：
<img src="image.jpg" alt="一只可爱的猫">
5.href 属性：用于指定链接的目标URL。
示例：
<a href="https://www.example.com">访问示例网站</a>
6.style 属性：用于内联样式，可以直接在元素上定义CSS样式。
示例：
<p style="color: blue; font-size: 16px;">这是一个蓝色的文本。</p>
第八部分：HTML实体
有些字符在HTML中有特殊含义，如果要在文本中显示它们，需要使用HTML实体编码。例如，< 在HTML中被解释为标签的开始，要显示< 字符，可以使用 <。
示例：
<p>这是一个 < 符号。</p>
第九部分：HTML布局
HTML的布局是通过使用<div> 元素和CSS来实现的。<div> 元素通常用于创建页面的不同部分，如页头、导航、侧边栏和页脚。
示例：
<div id="header">这是页头</div>
<div id="nav">这是导航栏</div>
<div id="content">这是内容</div>
<div id="footer">这是页脚</div>
第十部分：HTML响应式设计
响应式网页设计是确保网页在不同设备上（如手机、平板电脑和桌面电脑）上正常显示的重要概念。这通常通过CSS媒体查询来实现，以根据屏幕大小和方向应用不同的样式。
示例：
<link rel="stylesheet" href="styles.css">
第十一部分：HTML表格
HTML表格用于展示和组织数据，是网页中常见的元素之一。以下是HTML表格的基本结构和示例：
<table><tr><th>姓名</th><th>年龄</th></tr><tr><td>张三</td><td>25</td></tr><tr><td>李四</td><td>30</td></tr>
</table>
<table>元素：定义表格。<tr>元素：定义表格行。<th>元素：定义表头单元格，通常用于第一行。<td>元素：定义普通单元格。
第十二部分：HTML框架（Frames）
HTML框架已经不再推荐使用，因为它们带来了许多可访问性和维护性的问题。相反，推荐使用CSS和现代布局技术来构建页面。
第十三部分：HTML5 新特性
HTML5 引入了许多新的元素和特性，包括 <section>、<article>、<nav> 等，以及对多媒体元素的增强支持。这些特性使得构建现代、语义化的网页更加容易。
<section><h2>这是一个节</h2><p>节的内容在这里。</p>
</section><article><h2>这是一篇文章</h2><p>文章的内容在这里。</p>
</article><nav><ul><li><a href="#">首页</a></li><li><a href="#">关于我们</a></li><li><a href="#">联系方式</a></li></ul>
</nav>
第十四部分：HTML语义化
HTML语义化是指使用恰当的HTML元素来描述文档的结构和内容。例如，使用 <header> 元素表示页头，<footer> 元素表示页脚，以增加文档的可读性和可维护性。
<header><h1>网页标题</h1><p>网页的副标题或描述</p>
</header><footer><p>版权信息 © 2023</p>
</footer>
以上知识点为HTML简单基础入门知识点。
详解)
