HTML5 标准

超文本标记语言（英语：HyperText Markup Language，简称：HTML）

是一种用于创建网页的标准标记语言。

您可以使用 HTML 来建立自己的 WEB 站点，HTML 运行在浏览器上，由浏览器来解析。

在本教程中，您将学习如何使用 HTML 来创建站点。

注意：对于中文网页需要使用 <meta charset="utf-8"> 声明编码，否则会出现乱码。有些浏览器(如 360 浏览器)会设置 GBK 为默认编码，则你需要设置为 <meta charset="gbk">。

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<title>简单的教程(Zkcops)

</title>

</head>

<body>    <h1>标题</h1>    <p>段落。</p>

</body>

</html>

HTML文档的后缀名

  • .html

  • .htm

以上两种后缀名没有区别，都可以使用。

HTML 简介

实例解析

  • <!DOCTYPE html> 声明为 HTML5 文档

  • <html> 元素是 HTML 页面的根元素

  • <head> 元素包含了文档的元（meta）数据，

  • 如 <meta charset="utf-8"> 定义网页编码格式为 utf-8。

  • <title> 元素描述了文档的标题

  • <body> 元素包含了可见的页面内容

  • <h1> 元素定义一个大标题

  • <p> 元素定义一个段落

什么是HTML?

HTML 是用来描述网页的一种语言。

  • HTML 指的是超文本标记语言: HyperText Markup Language

  • HTML 不是一种编程语言，而是一种标记语言

  • 标记语言是一套标记标签 (markup tag)

  • HTML 使用标记标签来描述网页

  • HTML 文档包含了HTML 标签及文本内容

  • HTML文档也叫做 web 页面

HTML 标签

HTML 标记标签通常被称为 HTML 标签 (HTML tag)。

  • HTML 标签是由尖括号包围的关键词，比如 <html>

  • HTML 标签通常是成对出现的，比如 <b> 和 </b>

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

  • 开始和结束标签也被称为开放标签和闭合标签

<标签>内容</标签>

HTML 元素

"HTML 标签" 和 "HTML 元素" 通常都是描述同样的意思.

但是严格来讲, 一个 HTML 元素包含了开始标签与结束标签，如下实例:

HTML 元素:

<p>这是一个段落。</p>

Web 浏览器

Web浏览器（如谷歌浏览器，Internet Explorer，Firefox，Safari）是用于读取HTML文件，并将其作为网页显示。

浏览器并不是直接显示的HTML标签，但可以使用标签来决定如何展现HTML页面的内容给用户：

HTML 网页结构

下面是一个可视化的HTML页面结构：

<html>

<head>

<title>页面标题</title>

</head>

<body>

<h1>这是一个标题</h1>

<p>这是一个段落。</p>

<p>这是另外一个段落。</p>

</body>

</html>

只有 <body> 区域 (白色部分) 才会在浏览器中显示。

HTML版本

从初期的网络诞生后，已经出现了许多HTML版本:

版本 发布时间
HTML 1991
HTML+ 1993
HTML 2.0 1995
HTML 3.2 1997
HTML 4.01 1999
XHTML 1.0 2000
HTML5 2012
XHTML5 2013

<!DOCTYPE> 声明

<!DOCTYPE>声明有助于浏览器中正确显示网页。

网络上有很多不同的文件，如果能够正确声明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">

查看完整网页声明类型 DOCTYPE 参考手册。

中文编码

目前在大部分浏览器中，直接输出中文会出现中文乱码的情况，这时候我们就需要在头部将字符声明为 UTF-8。

欢迎关注：Zkcops

资源共享：择喀普斯

时间记录：2018-07-06

本文来源：菜鸟教程

 

HTML 教程的更多相关文章

  1. Angular2入门系列教程7-HTTP（一）-使用Angular2自带的http进行网络请求

    上一篇:Angular2入门系列教程6-路由(二)-使用多层级路由并在在路由中传递复杂参数 感觉这篇不是很好写,因为涉及到网络请求,如果采用真实的网络请求,这个例子大家拿到手估计还要自己写一个web ...

  2. Angular2入门系列教程6-路由（二）-使用多层级路由并在在路由中传递复杂参数

    上一篇:Angular2入门系列教程5-路由(一)-使用简单的路由并在在路由中传递参数 之前介绍了简单的路由以及传参,这篇文章我们将要学习复杂一些的路由以及传递其他附加参数.一个好的路由系统可以使我们 ...

  3. Angular2入门系列教程5-路由（一）-使用简单的路由并在在路由中传递参数

    上一篇:Angular2入门系列教程-服务 上一篇文章我们将Angular2的数据服务分离出来,学习了Angular2的依赖注入,这篇文章我们将要学习Angualr2的路由 为了编写样式方便,我们这篇 ...

  4. Angular2入门系列教程4-服务

    上一篇文章 Angular2入门系列教程-多个组件,主从关系 在编程中,我们通常会将数据提供单独分离出来,以免在编写程序的过程中反复复制粘贴数据请求的代码 Angular2中提供了依赖注入的概念,使得 ...

  5. Angular2入门系列教程1-使用Angular-cli搭建Angular2开发环境

    一直在学Angular2,百忙之中抽点时间来写个简单的教程. 2016年是前端飞速发展的一年,前端越来越形成了(web component)组件化的编程模式:以前Jquery通吃一切的田园时代一去不复 ...

  6. wepack+sass+vue 入门教程（三）

    十一.安装sass文件转换为css需要的相关依赖包 npm install --save-dev sass-loader style-loader css-loader loader的作用是辅助web ...

  7. wepack+sass+vue 入门教程（二）

    六.新建webpack配置文件 webpack.config.js 文件整体框架内容如下,后续会详细说明每个配置项的配置 webpack.config.js直接放在项目demo目录下 module.e ...

  8. wepack+sass+vue 入门教程（一）

    一.安装node.js node.js是基础,必须先安装.而且最新版的node.js,已经集成了npm. 下载地址 node安装,一路按默认即可. 二.全局安装webpack npm install ...

  9. Virtual Box配置CentOS7网络（图文教程）

    之前很多次安装CentOS7虚拟机,每次配置网络在网上找教程,今天总结一下,全图文配置,方便以后查看. Virtual Box可选的网络接入方式包括: NAT 网络地址转换模式(NAT,Network ...

  10. webpack之傻瓜式教程

    接触webpack也有挺长一段时间了,公司的项目也是一直用着webpack在打包处理,但前几天在教新人的情况下,遇到了一个问题,那就是:尽管网上的webpack教程满天飞,但是却很难找到一个能让新人快 ...

随机推荐

  1. Linux原始套接字实现分析---转

    http://blog.chinaunix.net/uid-27074062-id-3388166.html 本文从IPV4协议栈原始套接字的分类入手,详细介绍了链路层和网络层原始套接字的特点及其内核 ...

  2. 常用工具说明--mongodb、mysql解压版、IDEA配置maven

    Mongodb的安装.配置 1.去官网下载mongodb安装包,mongodb官网.点击右上角的 Download,下载对应的msi安装包 2.安装程序,选择 Custom,自定义安装路径,比如安装在 ...

  3. 十一、curator recipes之联锁InterProcessMultiLock

    简介 curator实现了一个类似容器的锁InterProcessMultiLock,它可以把多个锁包含起来像一个锁一样进行操作,简单来说就是对多个锁进行一组操作.当acquire的时候就获得多个锁资 ...

  4. 【原】spring boot source 1.5 中不支持 diamond 运算符

    最近要开发新的项目,就花了几天时间看了下spring boot的相关资料,然后做了一个demo,不得不说开发效率确实很快,几行注解就完成了事务,aop,数据库等相关配置:但由于先前习惯了spring ...

  5. 撩课-Python-每天5道面试题-第5天

    一. 给定一个圆心和半径, 以及一个点坐标, 判定该点是否在圆内; 例如: 用户输入圆心: (1, 2) 半径: 2.5 测试点为(2, 2)结果: 判定测试点是在圆内 思路: 结合勾股定理, 计算测 ...

  6. Bean的自动装配及作用域

    1.XML配置里的Bean自动装配 Spring IOC 容器可以自动装配 Bean,需要做的仅仅是在 <bean> 的 autowire 属性里指定自动装配的模式.自动装配方式有: by ...

  7. groovy闭包科里化参数

    科里化闭包:带有预先绑定形参的闭包.在预先绑定一个形参之后,调用闭包时就不必为这个形参提供实参了.有助于去掉方法调用中的冗余重复. 使用curry方法科里化任意多个参数 使用rcurry方法科里化后面 ...

  8. spss C# 二次开发 学习笔记（四）——Spss授权

    Spss的授权方式有两种,单机版和网络版. Spss的激活,在联网的情况下,通过20位的激活码激活,在未联网的情况下,Spss根据机器获取一个类似4-XXXX的锁定码,然后由激活码和锁定码算出一个授权 ...

  9. 百度翻译cs文件英文注释

    原由:本人英语烂,没办法看不懂国外的代码注释!只能借助其他手段来助我一臂之力了. 虽然翻译内容不是很准确,但好过什么都看不懂的强. 对吧?! 代码有点乱有用的园友自个整理一下吧! 最近没时间所以翻译后 ...

  10. OI中的一些模板

    线性筛 #include"cstdio" #include"cstring" #include"iostream" #include&quo ...