目录导航

在这里,您将了解HTML文档中使用的基本标签。 HTML有以下基本标记,将在本教程中学习:

  • HTML标题标签
  • HTML段落标记
  • HTML换行标记
  • HTML水平标记
  • HTML保留格式标记
  • HTML链接标签
  • HTML图片标签

1. HTML基本标签示例

下面是HTML文档中使用的基本标签的示例。也是有关HTML中基本标签的第一个示例。

<!DOCTYPE HTML>
<html>
<head>
    <title>HTML基本标签示例</title>
    <meta charset="utf-8">
</head>
<body>
    <h1>HTML基本标签</h1>
    <p>这是有关HTML基础标签的教程。</p>
    <p>在这里,<br/>你可以了解所有HTML基础标签。</p>
    <p>要了解完整的HTML标签,请参阅
    <a href="http://www.xntutor.com/html/html-elements.html">HTML所有标签教程</a></p>
</body>
</html>

在浏览器中打开上面代码文件,显示结果如下:

HTML基本标签示例

2. HTML保留格式标记

可以使用HTML <pre>标记自由编写“原样”文本。 例如,要编写计算机代码,请使用<pre>标记。 这是一个使用<pre>标记在网页上“按原样”书写的示例。

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <title>HTML教程</title>    
</head>
<body>
    <h2>HTML基本标签示例</h2>        
    <p>Welcome to 
        nxtutor.com
            不使用 pre 标签</p>
    <p>
        <pre>带<b>标签</b>。
            这是HTML基本标记示例
                了解
                    HTML保留格式
                        标签。
        </pre>
    </p>
</body>
</html>

在浏览器中打开上面代码文件,显示结果如下:

HTML保留格式标记

另一个示例:

<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="utf-8">
    <title>HTML教程</title>    
</head>
<body>
    <h2>HTML基本标签示例</h2>        
    <p>Welcome to 
        nxtutor.com
            不使用 pre 标签</p>
    <p>
        <pre> pre标签第一行
    pre标签第二行
pre标签第三行
            pre标签第五行
    pre标签第六行</pre>
    </p>
</body>
</html>

在浏览器中打开上面代码文件,显示结果如下: