HTML - 基本标签

原创

admin 2年前 (2024-05-07) 阅读数 206657 #HTML

HTML标签是用于定义文档结构的HTML的基本元素。这些是用尖括号（和）包围的字母或单词。

通常，大多数HTML标签都包含一个Opening和一个Close标签。每个标签都有不同的含义，浏览器会读取这些标签并相应地显示其包含的内容。

例如，如果我们用段落（）标签包裹任何文本，浏览器将其显示为单独的段落。在本教程中，我们将讨论HTML中的所有基本标签。

标题标签

任何文档都以标题开头。您可以为标题使用不同的尺寸。HTML还有六个级别的标题，使用元素h1、h2、h3、h4、h5和h6。显示任何标题时，浏览器都会在该标题之前添加一行和在该标题之后添加一行。

例如

以下HTML示例演示了不同级别的标题-

<!DOCTYPE html>
<html>
<head>
   <title>Heading Example</title>
</head>
<body>
   <h1>This is heading 1</h1>
   <h2>This is heading 2</h2>
   <h3>This is heading 3</h3>
   <h4>This is heading 4</h4>
   <h5>This is heading 5</h5>
   <h6>This is heading 6</h6>
</body>
</html>

段落标记

标签提供了一种将文本结构化为不同段落的方法。文本的每一段都应该位于开头p和结束/p标签之间，如下例所示-

例如

<!DOCTYPE html>
<html>
<head>
   <title>Paragraph Example</title>
</head>
<body>
   <p>Here is a first paragraph of text.</p>
   <p>Here is a second paragraph of text.</p>
   <p>Here is a third paragraph of text.</p>
</body>
</html>

断线标签

每当您使用 元素时，它后面的任何内容都会从下一行开始。此标签是空元素的一个示例，其中您不需要打开和关闭标签，因为它们之间没有任何东西可插入。

 标签在字符br和正斜线之间有一个空白。如果您省略此空白，旧浏览器将无法呈现断点，而如果您错过了正斜线字符而仅使用br，则在TLR中无效。

例如

<!DOCTYPE html>
<html>
<head>
   <title>Line Break Example</title>
</head>
<body>
   <p>Hello<br /> You delivered your assignment on time.<br />
      Thanks<br /> Mahnaz</p>
</body>
</html>

以内容为中心

您可以使用<center>标签将任何内容放在页面或任何表格单元格的中心。

例如

<!DOCTYPE html>
<html>
<head>
   <title>Centering Content Example</title>
</head>
<body>
   <p>This text is not in the center.</p>
   <center>
      <p>This text is in the center.</p>
   </center>
</body>
</html>

上述程序将文本“This text is in the Center”排列在屏幕中央。

水平线

水平线用于在视觉上分解文档的部分。hr标签从文档中的当前位置创建一条线到右页边距，并相应地打断该线。

例如

下面的例子在两个段落之间画了一条水平线-

<!DOCTYPE html>
<html>
<head>
   <title>Horizontal Line Example</title>
</head>
<body>
   <p>This is paragraph one and should be on top</p>
   <hr />
   <p>This is paragraph two and should be at bottom</p>
</body>
</html>

执行上面的示例时，您可以看到一条直线将这两个段落分开。

<hr />tag是空元素的一个示例，其中您不需要打开和关闭标签，因为它们之间没有任何东西可以插入。

<hr />元素在字符hr和正斜线之间有一个空白。如果您省略此空白，旧浏览器将无法呈现水平线，而如果您错过了正斜线字符并仅使用<hr>，则在TLR中无效

保留格式

有时，您希望文本遵循其在HTML文档中的准确编写格式。在这些情况下，您可以使用预格式化的标签<pro>。

开头的<预>标签和结束的</预>标签之间的任何文本都将保留源文档的格式。

例如

<!DOCTYPE html>
<html>
<head>
   <title>Preserve Formatting Example</title>
</head>
<body>
   <pre>
      function testFunction( strText ){
         alert (strText)
      }
   </pre>
</body>
</html>

如果您在不使用前执行相同的代码.& lt;/预标签。该功能将在没有预定义格式的情况下显示，如下所示-

function testFunction( strText ){ alert (strText) }

不间断的空间

假设，如果你想使用“12个愤怒的男人。“在这里，你不会希望浏览器将“12，愤怒”和“男人”分成两行--

这种技术的一个例子出现在电影《12个愤怒的男人》中。"

如果您不希望客户端浏览器中断文本，则应使用非中断空间实体 而不是普通空间。例如，在段落中编码“12个愤怒的男人”时，您应该使用类似于以下代码的代码-

例如

<!DOCTYPE html>
<html>
<head>
   <title>Nonbreaking Spaces Example</title>
</head>
<body>
   <p>An example of this technique appears in the movie "12 Angry Men."</p>
   <p>An example of this technique appears in the movie "12&nbsp;&nbsp;&nbsp;Angry Men."</p>
</body>
</html>

执行上述示例时，它将显示句子：该技术的一个示例出现在电影《12个愤怒的男人》中。”，两次。由于我们在12和男性之间添加了3个“”字符，第二次，您可以观察到三个空间。