HTML注释
注释语法
<!-- 这是一个HTML注释 -->
<!-- 表示注释的开始，
--> 表示注释的结束。
在这两个标记之间的文本将被视为注释内容，不会被浏览器解析和显示。
注释可以用于以下情况：
添加对代码的解释和说明，以便其他开发人员理解和维护代码。
暂时删除或禁用一段代码，而不必删除它们。
进行调试和测试，可以通过注释掉一些代码来排除错误。
请注意，注释应该清晰明了，并且不应该包含敏感信息或大量的无关内容，以保持代码的可读性和维护性。
HTML5文档声明
<!DOCTYPE html>
这行代码通常是HTML文档的第一行，位于标签之前。它告诉浏览器，当前文档使用的是HTML5规范。
相比于之前的HTML版本，HTML5的文档声明更加简洁明了。它不再指定DTD（文档类型定义），而是直接使用来声明。
HTML5的文档声明的好处包括：
简洁：HTML5的文档声明非常简单，只需一行代码即可。
兼容性：HTML5的文档声明能够良好地兼容各种现代浏览器。
标准化：HTML5的文档声明是HTML5规范的一部分，符合最新的标准化要求。
通过在HTML文档的开头添加HTML5的文档声明，可以确保浏览器正确地解析和呈现HTML5文档的内容。
HTML字符编码
在HTML中，有一些特殊字符具有特殊含义，比如小于号（<）、大于号（>）、引号（"）等。如果直接在HTML文档中使用这些字符，会导致解析错误或显示不正常。为了在HTML中正确显示这些特殊字符，可以使用字符实体或字符编码。
字符实体是一种特殊的表示方式，使用&符号和一个特定的实体名称或实体编号来表示字符。以下是一些常见的HTML字符实体示例：
<：小于号（<）
>：大于号（>）
"：双引号（"）
&：和号（&）
：空格（非断行空格）
除了字符实体，还可以使用字符编码来表示特殊字符。字符编码是一种将字符转换为数字的方式，常用的字符编码是Unicode编码。Unicode编码使用\u前缀加上一个十六进制数字来表示字符。例如：
\u003C：小于号（<）
\u003E：大于号（>）
\u0022：双引号（"）
\u0026：和号（&）
\u003C：小于号（<）
\u003E：大于号（>）
\u0022：双引号（"）
\u0026：和号（&）
使用字符实体或字符编码可以确保在HTML文档中正确显示特殊字符，避免解析错误。根据实际情况，选择合适的字符实体或字符编码来表示特殊字符。
注意：
- 平时编写代码时，统一采用UTF-8编码
- 为了让浏览器在渲染html文件时，不出错误，通过mete标签配合charset属性指定字符编码。
<head>
<meta charset="UTF-8"/>
</head>
HTML设置语言
如果您想在前端设置语言，"long"通常用来表示语言的长格式或全称。在前端开发中，您可以使用HTML的lang属性来设置页面的语言。
要设置页面的语言为"long"格式，您可以在HTML的标签上添加lang属性，并将其值设置为相应的语言代码。例如，如果您想设置页面的语言为英语（长格式），可以这样写：
<html lang="en">
<!--设置语言为英文-->
<html lang="zn-TW">
<!--设置语言为中文-->
HTML的标准结构
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>
排版标签
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>欧买噶的第一个网页</title>
</head>
<body>
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<p>我是一个段落</p>
<div>
<p>我是一个段落</p>
<p>我是一个段落</p>
<p>我是一个段落</p>
</div>
</body>
</html>
语义化标签
HTML语义化标签是指在HTML中使用具有语义含义的标签，以便更好地描述网页内容的结构和意义，从而让搜索引擎和辅助技术更好地理解和解析网页内容。以下是一些常见的HTML语义化标签：
<header>：用于定义页面或区域的页眉，通常包含网站的标志、导航链接和其他相关信息。
<nav>：用于定义页面的导航链接，通常包含指向其他页面或网站的链接。
<main>：用于定义页面的主要内容区域，通常包含最重要的内容。
<article>：用于定义独立的文章或内容块，通常包含完整的、自包含的内容，如博客文章、新闻报道等。
<section>：用于定义页面中的一个区域，通常包含与主题相关的内容。
<aside>：用于定义页面的侧边栏内容，通常包含与主题相关的补充信息。
<footer>：用于定义页面或区域的页脚，通常包含版权信息、联系方式等。
除了上述标签，还有一些其他的HTML语义化标签，如
、使用HTML语义化标签可以提高网站的可访问性、可读性和可维护性，同时也有利于搜索引擎优化（SEO）。因此，在编写HTML代码时，应该尽可能地使用语义化标签，并避免滥用
块级元素和行内元素
在HTML中，元素可以被分为两个主要类别：块级元素和行内元素。这两种元素具有不同的特性和用途。
块级元素（Block-level Elements）：
块级元素以块的形式显示在页面上，它们会独占一行，从新的一行开始，并且会在前后创建额外的空间。
块级元素可以包含其他块级元素和行内元素（几乎都写）。
常见的块级元素有以下等。
<div>、<p>、<h1>-<h6>、<ul>、<li>、<section>、<article> 这些常见 HTML 标签的含义和用途的解释：
<div>：<div> 是一个通用的块级元素，用于创建一个容器，用于组织和包裹其他 HTML 元素。它没有特定的语义含义，主要用于样式和布局目的。
<p>：<p> 是用于表示段落的标签。它用于包裹一段文本或内容，并在渲染时自动添加段落之间的空白。
<h1>-<h6>：<h1>-<h6> 是用于表示标题的标签，从 <h1> 表示最高级别的标题，到 <h6> 表示最低级别的标题。它们按照层次结构表示标题的重要性和级别，对于页面的结构和可读性很重要。
<ul>：<ul> 是无序列表的标签，用于创建一个无序列表。它包含一个或多个 <li> 标签，表示列表的每一项。
<li>：<li> 是列表项的标签，用于表示列表中的每一项。它通常嵌套在 <ul> 或 <ol> 标签中。
<section>：<section> 是用于表示页面中的一个独立区域或部分的标签，它可以包含相关的内容，并提供更好的结构化和语义化。
<article>：<article> 是用于表示一个独立的、完整的文章或内容块的标签。它应该是可以独立存在的，具有自包含的意义。
行内元素（Inline Elements）：
行内元素在同一行内显示，它们不会独占一行，而是尽可能地与其他内容在一行上显示。
行内元素只能包含其他行内元素或文本内容，不能包含块级元素。
常见的行内元素有 、、、、、、 等。
常用的文本标签
文本标签是用来包裹和呈现文本内容的HTML标签。它们用于定义文本的结构、样式和语义。以下是一些常见的文本标签：
<p>：用于表示段落，将一段文本包裹在<p>标签中，浏览器会自动在段落之间添加空白。
<span>：用于包裹小段文本或者行内元素，通常用于对文本进行样式或脚本处理。
<h1>-<h6>：用于表示标题，从<h1>表示最高级别的标题
到<h6>表示最低级别的标题。标题标签具有不同的字体大小和重要性，用于表示文档结构。
<strong>：用于表示强调文本，浏览器会以粗体显示<strong>标签中的文本。
<em>：用于表示强调或斜体文本，浏览器会以斜体显示<em>标签中的文本。
<blockquote>：用于表示长引用块，通常用于引用其他来源的文本。
<cite>：用于表示引用的标题，通常用于引用书籍、文章等的标题。
<code>：用于表示计算机代码或代码片段，浏览器会以等宽字体显示<code>标签中的文本。
<pre>：用于表示预格式化文本，保留文本中的空格和换行符，通常用于显示代码或文本的原始格式。
这些标签可以根据需要进行组合和嵌套，以创建具有良好结构和语义的文本内容。同时，可以通过CSS样式来进一步调整这些标签的外观和布局。
图片标签
图片标签是用来插入和显示图像的HTML标签。它们允许在网页中嵌入图像，并通过指定图像的URL来加载和显示图像。以下是常见的图片标签：
图片标签是用来插入和显示图像的HTML标签。它们允许在网页中嵌入图像，并通过指定图像的URL来加载和显示图像。以下是常见的图片标签：
<img>：
<img> 是最常用的图片标签，用于插入图像。
它是一个自闭合标签，没有闭合标签。通过设置 src 属性来指定图像的URL，
alt 属性用于提供图像的替代文本，以便在图像无法显示时提供可访问性支持。
<figure> 和 <figcaption>：<figure> 和 <figcaption> 标签用于为图像提供更多的语义和结构。<figure> 用于包裹一个图像，而 <figcaption> 用于提供图像的标题或说明。
html
<figure>
<img src="image.jpg" alt="描述图像的文本">
<figcaption>图像标题或说明</figcaption>
</figure>
这些标签可以根据需要进行组合和嵌套，以创建具有良好结构和语义的图像内容。此外，可以通过设置属性来调整图像的大小、样式和其他属性，如 width、height、class、style 等。
注意图片必须与代码文件在用一个文件夹。
本节基础整体代码
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>欧买噶的第一个网页</title>
<style>
h1{
font-size: 30px;
color:red;
background-color:blanchedalmond;
}
</style>
</head>
<body>
<h1>欧买噶的第一个网页</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<p>我是一个段落</p>
<div>
<p>我是一个段落</p>
<p>我是一个段落</p>
<p>我是一个段落</p>
</div>
<div>i love you</div>
<input type="text">
<input type="text">
<span>欧买噶</span>
<span>omg</span>
<p>
想要挣大钱就要<em>好好学习</em>
我真的很想<strong>出去玩</strong>
</p>
<img width="100" src="欧买噶.jpg" alt="欧买噶的第一个网页">
<img width="100" src="欧买噶.jpg" alt="欧买噶的第一个网页">
<figure>
<img width="100" src="欧买噶.jpg" alt="欧买噶的第一个网页">
<figcaption>oug</figcaption>
</figure>
</body>
</html>
运行结果
5753
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
