如何使用 HTML 属性


该系列的一部分:
如何使用 HTML 构建网站

本教程系列将指导您使用 HTML(用于在 Web 浏览器中显示文档的标准标记语言)创建和进一步自定义该网站不需要有任何编码经验,但如果您想重新创建演示网站,我们建议您从本系列开头开始

在本系列结束时,您应该有一个准备好部署到云的网站,并且基本熟悉 HTML。了解如何编写 HTML 将为学习其他前端 Web 开发技能(例如 CSS 和 JavaScript)奠定坚实的基础。

HTML属性可用于更改 HTML 元素的颜色、大小和其他特性。例如,您可以使用属性来更改文本元素的字体颜色或大小或图像元素的宽度和高度。在本教程中,我们将学习如何使用 HTML 属性来设置 HTML 文本元素的大小和颜色属性值。

HTML 属性放置在开始标记中,如下所示:

<element attribute="property:value;">

一个常见的属性是style,它允许您向 HTML 元素添加样式属性。虽然使用单独的样式表来确定 HTML 文档的样式更为常见,但我们将在本教程的 HTML 文档中使用 style 属性。

使用样式属性

我们可以<h1>使用 style 属性更改元素的多个属性。清除“index.html”文件并将以下代码粘贴到浏览器中。(如果您还没有关注教程系列,您可以index.html在我们的教程设置您的 HTML 项目 中查看设置文件的说明

<h1 style="font-size:40px;color:green;">This text is 40 pixels and green.</h1>

在我们在浏览器中加载文件之前,让我们回顾一下这个 HTML 元素的每个部分:

  • h1是标签的名称。它指的是最大尺寸的标题元素。
  • style是属性。此属性可以采用多种不同的属性。
  • font-size是我们为style属性设置的第一个属性。
  • 40px;是属性的值font-size,它将元素的文本内容设置为 40 像素。
  • color是我们为style属性设置的第二个属性。
  • green是属性的值color,它将文本内容颜色设置为绿色

请注意,属性和值包含在引号中,并且每一property:value对都以分号结尾;

保存文件并在浏览器中重新加载它。(有关在浏览器中加载文件的说明,请参阅此处教程。)您应该收到如下内容:

此文本为 40 像素和绿色。

您现在已经学习了如何使用该style属性来更改文本元素的字体大小和字体颜色。请注意,某些元素需要属性,例如<a>允许您向文本或图像添加链接的<img>元素,以及允许您向文档添加图像元素。我们将在接下来的教程中介绍这两个元素,并<div>在后面的教程系列中了解容器和其他 HTML 元素的其他属性用法

觉得文章有用?

点个广告表达一下你的爱意吧 !😁