HTML4.01超文本标记语言-HTML语法

最新推荐文章于 2024-07-08 22:44:43 发布

来聊前端

最新推荐文章于 2024-07-08 22:44:43 发布

阅读量63

点赞数

分类专栏： HTML 文章标签： html 前端

本文链接：https://blog.csdn.net/qq_36893834/article/details/131697881

版权

HTML 专栏收录该内容

12 篇文章 1 订阅

订阅专栏

HTML语法

学习目标

在这里插入图片描述

HTML基础语法

HTML 标签是由尖括号包围的关键词，例如 <html>。
HTML 标签通常是成对出现的，例如 <html> 和 </html> ，我们称为双标签。
有些特殊的标签必须是单个标签（极少情况），例如 <br />，我们称为单标签。
开始标签（Opening tag）：包含元素的名称（本例为 p），被大于号、小于号所包围。表示元素从这里开始或者开始起作用 —— 在本例中即段落由此开始。
结束标签（Closing tag）：与开始标签相似，只是其在元素名之前包含了一个斜杠。这表示着元素的结尾 —— 在本例中即段落在此结束。初学者常常会犯忘记包含结束标签的错误，这可能会产生一些奇怪的结果。
内容（Content）：元素的内容，本例中就是所输入的文本本身。
元素（Element）：开始标签、结束标签与内容相结合，便是一个完整的元素。

<!DOCTYPE html>
<html>
<head>
      <meta charset="UTF-8"/>
      <title>第一个网页</title>
</head>
<body>
    <p>今天阳光明媚</p>
</body>
</html>

元素也可以有属性（Attribute）属性包含了关于元素的一些额外信息，这些信息本身不应显现在内容中。本例中，class 是属性名称，sun是属性的值。class 属性可为元素提供一个标识名称，以便进一步为元素指定样式或进行其他操作时使用。

<!DOCTYPE html>
<html>
<head>
      <meta charset="UTF-8"/>
      <title>第一个网页</title>
</head>
<body>
    <p class="sun">今天阳光明媚</p>
</body>
</html>

属性应该包含：

在属性与元素名称（或上一个属性，如果有超过一个属性的话）之间的空格符。
属性的名称，并接上一个等号。
由引号所包围的属性值。

HTML标签关系

包含关系，也叫父子关系。

<head>
      <meta charset="UTF-8"/>
      <title>第一个网页</title>
</head>

并列关系，也叫兄弟关系。

<head></head>
<body></body>

HTML页面结构介绍

我们还是以第一个网页为例子，详细的讲解每个标签的作用。

<!DOCTYPE html>
<html>
    <head>
          <meta charset="UTF-8"/>
          <title>第一个网页</title>
    </head>
    <body>
        hello world
    </body>
</html>

每个网页都会有一个基本的结构标签（也称为骨架标签），页面内容也是在这些基本标签上书写。

标签名	定义	说明
`<!DOCTYPE html>`	文档类型	浏览器解析页面的方式。
`<html></html>`	HTML标签	页面中最大的标签，我们称为根标签。
`<head></head>`	头部标签	定义文档的头部，它是所有头部元素的容器。
`<meta charset="UTF-8"/>`	编码标签	告诉浏览器用那种编码解析页面。
`<title></title>`	标题标签	网页的标题。
`<body></body>`	身体标签	网页主要内容的容器。