码迷,mamicode.com
首页 > Web开发 > 详细

w3schools网站的HTML教程之HTML介绍

时间:2020-04-05 15:41:27      阅读:72      评论:0      收藏:0      [点我收藏+]

标签:名称   type   不同的   声明   类型   html   art   第一个   htm   

什么是HTML

HTML 是一种描述 Web 文档(页面)的标记语言。

  • HTML 代表超文本标记语言(Hyper Text Markup Language)

  • 标记语言就是一组标记标签

  • HTML 文档是由 HTML 标签来描述的

  • 每个 HTML 标记描述了不同的文档内容

HTML 示例代码

<!DOCTYPE html>
<html>
  <head>
    <title>Page Title</title>
  </head>
  <body>

    <h1>My First Heading</h1>
    <p>My first paragraph.</p>

  </body>
</html>

示例代码解释

  • DOCTYPE 声明定义将 HTML 文档类型

  • <html></html>标签之间的文本描述了一个 HTML 文档

  • <head></head>标签之间的文本提供了有关 HTML 文档的信息

  • <title></title>标签之间的文本提供了有关 HTML 文档的标题

  • <body></body>标签之间的文本描述了可见的 HTML 文档内容

  • <h1></h1>标签之间的文本描述了标题

  • <p></p>标签之间的文本描述了段落

通过使用这些描述,浏览器可以显示一个 HTML 文档的标题和段落。

HTML 标签

HTML 标签是包含了一对尖角号的关键词(标签名称):

<tagname>content</tagname>
  • HTML 标签通常是成对的,比如<p></p>

  • 一对标签中的第一个标签是开始标签,第二个是结束标签

  • 结束标签像开始标签一样编写,只是在标签名称的前面有一个斜杠

开始标签也可以叫做打开标签,结束标签也可以叫做关闭标签。

Web 浏览器

一个 Web 浏览器的作用是读取并显示一个 HTML 文档。
一个 Web 浏览器不显示 HTML 标签,而是通过它们来确定如何显示 HTML 文档。

技术图片

HTML 页面结构

下面是一个 HTML 页面结构的示例:

<html>
  <head>
    <title>Page title</title>
  </head>
  <body>
    <h1>This is a heading</h1>
    <p>This is a paragraph.</p>
    <p>This is another paragraph.</p>
  </body>
</html>

浏览器只显示<body>标签区域内的内容。

<!DOCTYPE> 声明

<!DOCTYPE> 声明有助于浏览器能够正确地显示 HTML 页面。
网络中具有不同的文档类型。
想要正确地显示 HTML 文档,浏览器必须要知道 HTML 文档的类型和版本。
<!DOCTYPE> 声明是不区分大小写的,以下所有写法都是正确地:


<!DOCTYPE html>

<!DOCTYPE HTML>

<!doctype html>

<!Doctype Html>

常见声明

HTML5

<!DOCTYPE html>

HTML 4.01

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

XHTML 1.0

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

HTML 版本

在网络的早期,HTML 就具有了很多版本:

版本 年份
HTML 1991
HTML 2.0 1995
HTML 3.2 1997
HTML 4.01 1999
XHTML 2000
HTML5 2014

本文翻译于《w3schools》网站提供的 HTML 教程。

w3schools网站的HTML教程之HTML介绍

标签:名称   type   不同的   声明   类型   html   art   第一个   htm   

原文地址:https://www.cnblogs.com/baimeishaoxia/p/12637158.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!