举报投诉联系我们 手机版 热门标签 编程学
您的位置:编程学 > html结构包括哪两大部分 HTML 结构

html结构包括哪两大部分 HTML 结构

2023-06-01 23:18 HTML教程

html结构包括哪两大部分 HTML 结构

html结构包括哪两大部分

HTML结构包括两大部分:元数据和内容。

元数据是用来描述文档的信息,它们可以被浏览器或者其他应用程序使用,来帮助理解文档的内容。元数据可以包含文档的标题、作者、关键字、语言等信息。例如:

<head> 
    <title>My Document</title> 
    <meta name="author" content="John Doe" /> 
    <meta name="keywords" content="HTML, structure" /> 
    <meta name="description" content="This document explains the structure of HTML documents." /> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 
</head>

内容是文档中显示的内容,例如文本、图片、表格等。HTML 标记用来标识不同的内容,并且可以在浏览器中正确显示出来。例如:

<body> 
    <h1>My Document Title</h1> 

    <p>"Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum." <

HTML 结构

HTML结构

元素和属性用于标记HTML文档中的内容。

HTML文档是具有.html文件扩展名的文本文件。

您可以直接从磁盘或通过Web服务器将文件加载到浏览器中。对于大多数html文件,您可以将其拖放到浏览器窗口。

结构体

两个元素提供了HTML文档的外部结构:

  • DOCTYPE element
  • html element

以下代码显示了Web文档的基本结构。

<!DOCTYPE HTML>
<html>
<!--  elements go  here   -->
</html>

DOCTYPE 元素告诉浏览器它正在处理一个HTML文档。这通过HTML布尔属性表示:

<!DOCTYPE HTML>

html的开始标记位于DOCTYPE元素之后。

HTML文档是包含html标签的文本文件。HTML文档中的HTML标记标记网页。

将以下内容保存到名为index.htm的文本文件,然后将其拖放到浏览器。

<!DOCTYPE HTML>
<html> 
    <body> 
        <h1>My Heading</h1> 
        <p>My paragraph</p> 
    </body> 
</html>

HTML文档以<!DOCTYPE HTML>开头。<!DOCTYPE HTML> 告诉浏览器这是一个html文档。

<html> </html> 之间的内容标记网页。<body> </body> 标记可见的网页内容。<h1> </h1> 用于定义标题。<p> </p> 创建段落。


HTML元数据

HTML文档中的元数据提供了有关文档的信息。

元数据包含在head元素中。

<!DOCTYPE HTML>
<html>
    <head>
        <!--  define your metadata here   -->
        <title>web document title</title>
    </head>
</html>

上面代码中的 title 元素是元数据。

大多数浏览器在浏览器中显示title元素窗口标题栏或显示页面的选项卡顶部。

head 元素也定义了与外部的关系资源(如CSS样式表),定义内联CSS样式和定义和加载脚本。


HTML Body

通过 body 元素添加html文档的内容。

下面的代码将一行文本添加到body元素。

<!DOCTYPE HTML>
<html>
    <head>
        <!--  metadata goes here   -->
        <title>Example</title>
    </head>
    <body>
       This is the <code>content</code>.
    </body>
</html>

body 标记中的内容中渲染的内容。

父元素与子元素

HTML元素定义与HTML文档中其他元素的关系。

包含另一个元素的元素是第二个元素的父级。

<!DOCTYPE HTML>
<html>
    <head>
        <!--  metadata goes here   -->
        <title>Example</title>
    </head>
    <body>
       This is the <code>content</code>.
    </body>
</html>

body 元素是code元素的父代,因为 code 元素包含在开始之间和 body 元素的结束标记。

code 元素是 body 元素的子元素。

元素可以有多个子元素,但只能有一个父元素。

后代

html 元素包含 body 元素,其中包含code元素。

body code元素是 html 元素的后代。

只有 body 元素是 html 元素的子元素。

孩子是直接的后代。

共享相同父元素的元素称为兄弟元素。

head body 元素是兄弟。

阅读全文
以上是编程学为你收集整理的html结构包括哪两大部分 HTML 结构全部内容。
声明:本站所有文章资源内容,如无特殊说明或标注,均为采集网络资源。如若本站内容侵犯了原著者的合法权益,可联系本站删除。
相关文章
  • htmlmeter用法 HTML Meter

    htmlmeter用法 HTML Meter

    2023-05-22 HTML教程

    HTML Metermeter元素显示在可能值范围的上下文中显示的值。它具有局部属性: value,min,max,low,high,optimum,form 。min和...

  •  HTML 注释

    HTML 注释

    2023-06-15 HTML教程

    本章为大家带来的是HTML注释标签 ​!--​ 与 ​-- ​用于在 HTML 插入注释。HTML 注释标签您能够通过如下语法向 HTML 源代码添加...

  • html区块居中 HTML 区块

    html区块居中 HTML 区块

    2023-03-20 HTML教程

    HTML div 和span HTML 可以通过 div 和 span 将元素组合起来。HTML 区块元素 大多数 HTML 元素被定义为块级元素或内联元素。块级...

  •  XHTML高级教程-相对路径

    XHTML高级教程-相对路径

    2023-04-20 XHTML教程

    通过指定链接文档的相对路径,可以将文档链接到其他目录。例如,位于子目录代码中的文件mycode.html的链接是:A href=”codes/my...

  •  XHTML 语法规则

    XHTML 语法规则

    2023-06-19 XHTML教程

    通过上节《XHTML与HTML之间的差异》的学习,我们知道编写 XHTML 代码需要干净的 HTML 语法,XHTML语法与HTML语法非常相似,几乎...

© 2024 编程学 bianchengxue.com 版权所有 联系我们
桂ICP备19012293号-7 返回底部