HTML 文档的结构：学习 HTML 的基本结构
已发表: 2020-12-14HTML 已被用作可通过浏览器数据在 Internet 上访问的文档的标准标记语言。 HTML 由一系列短元素、标签和代码组成，当它们以结构化格式编译在一起时，可以创建一个任何人都可以通过适当的互联网访问查看的网页。
它改变了人们的工作方式。 HTML 和 CSS 与 javascript 一起用于在网页上创建和操作元素，HTML 让创建者为每个元素定义不同的角色，从而在创建过程中提供完全的自定义自由。
HTML 代表超文本标记语言，用于设计在网站上显示的网页。
将三个主要方面放在一起有助于构建网页。
- HTML结构——支持结构元素
- CSS 样式——帮助设计并为这些结构元素赋予样式
- JS 交互——启用这些元素之间的交互
在HTML 结构中，元素和标签相互配对以标记内容。
互联网上的每个页面都包含 HTML 标签。 这些标签有助于以清晰开放的视角在线显示内容，并且始终可以对其进行审核和更改。 为了更简单地解释事情，让我们描述一下元素和标签在程序中是如何使用的。
开始和结束元素发生变化，但标签保持不变。 标签插入句子之前和结尾，使它们能够在页面上进行格式化。 一个理想的网页由三个主要和基本部分组成：
- 标题
- 头
- 身体
Head 元素用于突出显示头部部分的开始/标题。 头部部分总是有助于作为关于页面的描述。 标题标签内的内容，即标题，是用作识别页面内容的来源。
下面列出了所有可以在 head 元素中使用的标签：
- <基地>
- <链接>
- <元>
- <无脚本>
- <脚本>
- <风格>
- <标题>
例如：
<头部>
<TITLE> HTML 中的 Hello world 示例<TITLE>
</头>
块级元素用于标识网页的特定部分，可以是段落、子标题或要创建的某些列表。
段落：<P>和</P>
标题，一级：<H1>标题，二级：<H2>和</H2>
水平尺：<HR> 居中：<CENTER>
页脚：没有特殊的标签来表示它，但仍然建议在网页上设置页脚，以帮助识别需要与作者联系的部分。 它们可能包括常见问题解答部分或订阅时事通讯的电子邮件。
<HTML>
<头部>
<TITLE>一家鞋业公司 <TITLE>
</头>
<身体>
<H1>欢迎来到神奇鞋！ </H1>：</H2>
<IMG SRC=.”.http://example.com/images/image1.jpg”><HR>
<CENTER> 为什么不访问 <A HREF =..http://www.example1.com/..>示例网站
</A>
</中心>
</正文>
</HTML>
上面的部分解释了HTML 结构的网页中的主要元素。
现在，我们转向 HTML 源代码，并尝试了解如何使用它来理解程序结构及其元素。
作为初学者，这有助于了解其他页面是如何开发的，并且可以作为参考来为您自己的网页创建自定义版本。
单击网页上任意位置的右键，然后选择“查看页面源”。 这将打开一个包含页面源代码的窗口。
检查页面
单击网页上任意位置的右键，然后选择“检查”以查看用于构建该特定网页的元素的列表和类型。 它将包括 HTML 和 CSS，可以通过样式面板进行修改。
解释了 HTML的基本结构及其标签后，现在让我们了解在 HTML 中编写内容所需的基本元素。
<p> 当需要一个段落时，此标签用于网页中，并使用 </p> 标签结束它。
<br> 此标签用于换行，主要用于写单行，无论是联系人还是地址。
<hr> 该标签用于将网页内容分成两部分。
这里的所有标签都是在一个示例网页代码中实现的
学习： 21 个 Web 开发项目理念
输入
<html>
<头部>
<标题></标题>
</head>
<正文>
<h1>HTML 结构</h1>
<p>
由 upGrad 教育<br>
<小时>
学习基础知识 <br>
<小时>
由 upGrad 教育<br>
</p>
</正文>
</html>
属性
对于提到的所有标签，当需要额外信息时使用属性。 属性由两个参数定义，即“值”和“名称”。
在这里，'name' 参数有一个函数来获取它被认为是分配的属性的名称。 'value' 参数具有类似的功能，可以获取与元素对齐的属性名称的值。
<img> 此属性用于在网页中添加/嵌入图像。 此标签将有助于指定图像路径。 <height> 和 <width> 分别表示图像的高度和宽度。
<alt> 当图像由于连接错误或其他原因而无法加载时应用此属性。 alt 标签用作图像的副标题。
报名参加世界顶尖大学的软件工程课程。 获得行政 PG 课程、高级证书课程或硕士课程，以加快您的职业生涯。
阅读： 8 个令人兴奋的全栈项目创意和主题
例子
<html>
<正文>
<h2>src 属性</h2>
<p>HTML图片是用img标签定义的，图片源的文件名在src属性中指定：</p>
<img src=”img_101.jpg” alt=”一张空图片” width=”500″ height=”600″>
</正文>
</html>
<style> 标签用于更改文本样式、大小、字体和与文本相关的任何其他功能
例子
<html>
<正文>
<h2>样式属性</h2>
<p>该属性用于改变样式，例如颜色：</p>
<p style=”color:red;”>这是一个红色段落。</p>
</正文>
</html>
对于文本修改应用程序，HTML 还提供了标签来使用这些标签将文本修改为自定义请求。
- <b> – 粗体文本
- <strong> – 重要文本
- <i> – 斜体文本
- <em> – 强调文本
- <mark> – 标记文本
- <small> – 较小的文本
- <del> – 删除的文本
- <ins> – 插入的文本
- <sub> – 下标文本
- <sup> – 上标文本
总结这篇文章，我们学习了 HTML 的以下特性和基础知识：
- HTML结构
- 标签、元素及其类型
- 基本标签及其应用
所有这些特性、标签和属性都有助于理解对HTML 的需求。
如果您有兴趣了解有关全栈软件开发的更多信息，请查看 upGrad 和 IIIT-B 的全栈软件开发执行 PG 计划，该计划专为在职专业人士设计，提供 500 多个小时的严格培训、9 个以上的项目，和任务、IIIT-B 校友身份、实用的实践顶点项目和顶级公司的工作协助。
