HTML 元素-css教程

首页 2024-07-10 10:38:38

上周,你成了一名 web 开发人员!做得好!我们开始研究! html 用于构建不同类型的文档元素,以便构建文档 internet 浏览器可以读取文档。但是,html 几乎一切都使用元素!本周,我们将介绍四种不同类型的元素以及如何使用它们。最后,您将向上周创建的页面添加内容!

如果您刚找到该系列,请查看该系列的页面,或者如果您需要复习,请转到上周的文章!

文本元素

文本构成了互联网的大部分内容。你在任何页面上放置的最基本的内容之一是文本!因为我们需要能够格式化文本, HTML 它为我们提供了围绕文本的元素,并为我们的内容提供了一些组织。

段落元素

将传统文本添加到我们的页面中,我们将文本放置在开始和结束

标记之间!查看示例并亲自尝试!


头>

  <p>这是一些常规正文。</p>
  <p>还有更多!</p><p><span>立即学习</span>“<a href="https://pan.quark.cn/scb635dc7db1" style="text-decoration: underline !important; color: blue; font-weight: bolder;" rel="nofollow" target="_blank">前端免费学习笔记(深入)</a>”;</p>
正文&gt;

为什么我们称之为“段落”?嗯,如果我们把这两个元素放在不同的行中,它们就会出现在不同的行中,从而有效地形成一个段落。如果你在网上查看新闻文章,每次你看到一个新的段落,你都会看到一个单独的段落

元素!

标题

如果一切都是正文,我们的页面看起来会很平淡。帮助用户理解我们网站内容的最好方法之一就是用信息丰富的标题标记。 HTML 有 6 不同的标题元素,他们的语法不难记住!

<h1>标题</h1>
<h2>副标题</h2>
<h3>标题</h3>
<h4>副标题</h4>
<h5>部分</h5>
<h6>小节</h6>

默认情况下,您的浏览器将

将标题设置为最大标题 标题是最小的,但是当我们理解的时候 CSS 你会发现情况并非如此。

对于标题,我们还需要遵循一些使用它们的规则:

  • 每个页面只能有一个 标签。
  • 按顺序使用标题:以后不要跳。
  • 使用所有标题来描述页面的内容!

如果你不遵循这些规则,你的网页仍然会出现,但你的文档将不再格式良好。我们遵循这些规则是因为它使浏览器更容易阅读和解释你的页面,并使搜索引擎更容易知道你页面上的重要信息是什么!

创建列表

我们还可以在列表中构建页面上的信息。 HTML 提供两个列表:有序列表和无序列表。您可以将其称为编号列表和项目符号列表。为了创建列表,您将嵌入列表项元素的列表类型!以下是几个例子:

<ol>
<li>第 1 项</li> <!-- 1. 第 1 项 -->
  <li>第 2 项</li> <!-- 2. 第 2 项 -->
  <li>第 3 项</li> <!-- 3. 第 3 项 -->
</ol>
  • 项目 1
  • 第 2 项
  • 第 3 项

在大多数情况下,除非信息必须连续,例如食谱说明,否则您将使用无序列表。

添加图像

到目前为止,我们的页面上只有文本,但为了使我们的页面更有趣,我们可以添加图像、音频或视频! HTML 还有这些元素!

在我们的网站上添加图像,我们将使用它

就这样!你的网页上的图像!

挑战

现在你已经掌握了一些新的元素,本周有一个挑战!制作你自己的“关于我”页面。至少使用两个不同的标题级别,一个列表,一个关于你自己的信息,并包含一张图片!确保使用适当的元素并在您的网络浏览器上打开它!

下周见!

上面是HTML 要素的详细内容,更多请关注其它相关文章!


p