HTML是什么？您构建网页的一站式解决方案

2020年9月28日SEO教程1 1,6789

HTML是Web上用于开发网页的最广泛使用的语言之一。它可以帮助您深入研究Web开发领域并提高技能。MAY的SEO博客将按一下顺序详细介绍html是什么以及html的基础知识。

HTML的起源

超文本标记语言（HTML）的历史是一个奇怪而有趣的故事。作为HTML背后的人，蒂姆·伯纳斯·李（Tim Berners-Lee）将他的第一个基本的Web浏览和创作系统组合在一起，并创建了一种可满足其目的的快速的超文本语言。
文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

但是问题在于语言的简单性。HTML是基于文本的，任何人都可以使用任何编辑器或文字处理器来创建或转换Web文档。开发人员开始在其浏览器中实现新功能，并开始发布HTML的高级版本。文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

HTML是什么？

一个标记语言是用于应用布局和格式转换为一个文本文档的计算机语言。标记语言使文本更具交互性和动态性。它可以将文本转换为图片、表格、链接等。
文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

HTML代表超文本标记语言，它是用于创建网页和Web应用程序的标准标记语言。它用于使用标记描述网页的结构。文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

HTML结构文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

HTML标签主要有两种类型：块级标签和内联标签。文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

1. 块级元素会占用全部可用空间，并始终在页面上开始新起一行。块标签的示例包括标题和段落。文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

2. 内联元素仅占用所需的空间，并且不会在页面上开始新起一行。它们通常用于块级元素的内部内容。内联标签的一些示例包括链接和强调的字符串。文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

HTML文档所需的三个块级别标签为<html><head>和<body>。文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

1. 在<html> </html>标签包围每一个最高级别的元素HTML页面。文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

2. 在<head></head>标记持有的元信息，如网页的标题和字符集。文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

3. 最后，<body> </ body>标记将页面上显示的所有内容括起来。文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

HTML如何工作？

HTML文档以.html或.htm扩展名结尾。您可以使用任何网络浏览器查看它。浏览器读取HTML文件并呈现内容以供用户查看。文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

每个HTML页面都包含一组标记或元素，这些标记或元素被称为网页的构建块。他们创建了一个层次结构，将内容结构化为节，段落，标题和其他内容块。文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

让我们来看一个示例，看看HTML中元素的结构如何：文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

<div>
<h1>The Main Heading</h1>
<h2>Subheading</h2>
<p>Paragraph</p>
<img src="/" alt="Image">
<p>Second Paragraph with <a href="https://example.com">hyperlink</a></p>
</div>

HTML基础

要使用HTML构建网页，您需要了解一些基本元素，例如：文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

标题文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

HTML标题使用<h1>至<h6>标记定义文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

<h1>定义最重要的标题。而<h6>定义了最不重要的标题文章源自MAY的SEO博客-https://may90.com/jiaocheng/html.html

<h1>First Heading</h1>
<h2>Second Headng</h2>
<h3>Third Heading</h3>
<h4>Fourth Heading</h4>
<h5>Fifth Heading</h5>
<h6>Sixth Heading</h6>

段落

HTML段落使用标记定义。您可以使用此标记添加任意数量的段落。

<p>First Paragraph.</p>
<p>Second Paragraph.</p>

链接

HTML链接是超链接。您可以单击链接，然后重定向到另一个文档或网页。链接用法如下：

<a href="https://may90.com">SEO博客</a>

图片

需要图像以简单的方式在网页上美化或描绘复杂的概念。HTML图像使用<img>标记定义。

提供源文件（src），替代文本（alt），宽度和高度作为属性：

<img src="image.jpg" alt="SEO" style="width:120px; height:150px">

按钮

所述<按钮>元素用于创建HTML按钮。开头和结尾标签之间的所有文本在按钮上显示为文本。它定义了一个可点击的按钮。在<button>元素内，您可以添加文本或图片：

<button>Click here</button>

列表

HTML提供了三种指定信息列表的方式。所有列表必须包含一个或多个列表元素。

1. <ul>：无序列表使用普通项目符号对项目进行排序。

2. <ol>：有序列表使用不同的数字方案来列出您的项目。

3. <dl>：定义列表以与在字典中相同的方式排列项目。

无序列表

此列表是使用HTML <ul>标记创建的：

<ul>
<li>Python</li>
<li>Java</li>
<li>DevOps</li>
<li>Cloud Computing</li>
</ol>
</ul>

有序列表

此列表是使用HTML <ol>标记创建的：

<ol>
<li>Python</li>
<li>Java</li>
<li>DevOps</li>
<li>Cloud Computing</li>
</ol>

定义列表

定义列表是呈现词汇表，术语列表或其他名称/值列表的理想方法。它是使用<dl>，<dt>和<dd>标记创建的：

<dl>
<dt><b>HTML</b></dt>
<dd>This stands for Hyper Text Markup Language</dd>
<dt><b>HTTP</b></dt>
<dd>This stands for Hyper Text Transfer Protocol</dd>
</dl>

表格

HTML表是用<table>标签定义的。

行用<tr>标记定义。

标头是用<th>标签定义。

表单元格用<td>标记定义。

<table>
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>

HTML是网络的主要标记语言。它可以在各种浏览器中本地运行，并由万维网联盟维护。您可以使用它来创建网站和Web应用程序的内容结构。它是最低级别的前端技术，可作为您可以添加CSS的样式以及可以使用JavaScript实现的功能的基础。