一、HTML5简介

一、简介

  • 超文本标记语言(英语:HyperText Markup Language,简称:HTML)是一种用于创建网页的标准标记语言。
  • 可以使用 HTML 来建立自己的 WEB 站点,HTML 运行在浏览器上,由浏览器来解析。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>简单示例</title>
</head>
<body><h1>我的第一个标题</h1><p>我的第一个段落。</p>
</body>
</html>

 运行结果:

二、HTML文档的后缀名

  • .html
  • .htm

三、实例解析 

  • <!DOCTYPE html> 声明为 HTML5 文档
  • <html> 元素是 HTML 页面的根元素
  • <head> 元素包含了文档的元(meta)数据,如 <meta charset="utf-8"> 定义网页编码格式为 utf-8
  • <title> 元素描述了文档的标题
  • <body> 元素包含了可见的页面内容
  • <h1> 元素定义一个大标题
  • <p> 元素定义一个段落

注:在浏览器的页面上使用键盘上的 F12 按键开启调试模式,就可以看到组成标签。 

三、什么是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页面结构:

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

八、<!DOCTYPE> 声明

  • <!DOCTYPE>声明有助于浏览器中正确显示网页。
  • 网络上有很多不同的文件,如果能够正确声明HTML的版本,浏览器就能正确显示网页内容。
  • doctype 声明是不区分大小写的,以下方式均可:
<!DOCTYPE html><!DOCTYPE HTML><!doctype html><!Doctype Html>

九、通用声明

HTML5

<!DOCTYPE html>

 十、中文编码

  • 目前在大部分浏览器中,直接白色区域输出中文会出现中文乱码的情况,这时候我们就需要在头部将字符声明为 UTF-8 或 GBK。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>
页面标题</title>
</head>
<body><h1>我的第一个标题</h1><p>我的第一个段落。</p></body>
</html>

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/592623.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

GoLang学习之路,对Elasticsearch的使用,一文足以(包括泛型使用思想)(一)

这几天没有更新&#xff0c;其主要的的原因是&#xff0c;在学习对Elasticsearch的使用。Elasticsearch是一个非常强大的数据库索引工具。是一个基于Lucene库的搜索引擎。它提供了一个分布式、支持多租户的全文搜索引擎&#xff0c;具有HTTP Web接口和无模式JSON文档。Elastics…

【模拟电路】模拟集成电路之神-NE555

一、集成电路NE555简介 二、功能框图与引脚说明 三、比较器&#xff08;运放&#xff09; 四、反相门&#xff08;非门&#xff09; 五、或非门 六、双稳态触发器 七、NE555的工作原理 集成电路NE555的芯片手册 C5157696 一、集成电路NE555简介 NE555起源于上个世纪70年代&a…

Eureka服务注册与发现中心

简介 Spring Cloud封装了Netflix 公司开发的Eureka模块来实现服务治理 在传统的RPC远程调用框架中&#xff0c;管理每个服务与服务之间依赖关系比较复杂&#xff0c;管理比较复杂&#xff0c;所以需要使用服务治理&#xff0c;管理服务于服务之间依赖关系&#xff0c;可以实现…

【Math】重要性采样 Importance sample推导【附带Python实现】

【Math】重要性采样 Importance sample推导【附带Python实现】 文章目录 【Math】重要性采样 Importance sample推导【附带Python实现】1. Why need importance sample?2. Derivation of Discrete Distribution3. Derivation of Continuous Distribution3. An Example 笔者在学…

Cloud模型matlab

学习资料python 多维正态云python 预备知识&#xff1a; 如何获取具有特定均值和方差的正态分布随机数。首先&#xff0c;初始化随机数生成器&#xff0c;以使本示例中的结果具备可重复性。 rng(0,twister);基于均值为 500 且标准差为 5 的正态分布创建包含 1000 个随机值的向…

Linux学习之系统编程3(进程及wait函数)

写在前面&#xff1a; 我的Linux的学习之路非常坎坷。第一次学习Linux是在大一下的开学没多久&#xff0c;结果因为不会安装VMware就无疾而终了&#xff0c;可以说是没开始就失败了。第二次学习Linux是在大一下快放暑假&#xff08;那个时候刚刚过完考试周&#xff09;&#xf…

Kubernetes 集群搭建(新人白嫖青云服务器) 一个master节点+两个工作节点

文章目录 1&#xff0c; 购买青云服务器&#xff08;白嫖&#xff09;2&#xff0c;创建 VPC3&#xff0c;连接测试4&#xff0c;安装 docker4.1&#xff0c;安装docker 20.10.74.2&#xff0c;配置加速镜像 5&#xff0c;安装 Kubernetes5.1&#xff0c;要求5.2&#xff0c;设…

CRM市场营销管理功能,如何进行客户细分和数据分析?

CRM管理系统中的营销管理模块&#xff0c;它的锋芒常被销售管理所掩盖&#xff0c;但对于企业的业务来说同样重要。营销部门虽然不像销售人员一样直接面对客户&#xff0c;却是挖掘线索、商机的重要角色。CRM在市场营销领域的关键功能包括&#xff1a;营销漏斗、客户细分、营销…

关于“Python”的核心知识点整理大全50

目录 python_repos.py 17.1.6 概述最受欢迎的仓库 python_repos.py 17.1.7 监视 API 的速率限制 注意 17.2 使用 Pygal 可视化仓库 python_repos.py 17.2.1 改进 Pygal 图表 python_repos.py 往期快速传送门&#x1f446;&#xff08;在文章最后&#xff09;&#xf…

抽象类和接口的区别

抽象类和接口的区别&#xff1a; 抽象类&#xff08;Abstract Class&#xff09;&#xff1a; 抽象类是一种不能被实例化的类&#xff0c;它只能被用作其他类的父类&#xff08;基类&#xff09;。抽象类可以包含抽象方法和非抽象方法。抽象方法是没有具体实现的方法&#xf…

2020年认证杯SPSSPRO杯数学建模B题(第二阶段)分布式无线广播全过程文档及程序

2020年认证杯SPSSPRO杯数学建模 B题 分布式无线广播 原题再现&#xff1a; 以广播的方式来进行无线网通信&#xff0c;必须解决发送互相冲突的问题。无线网的许多基础通信协议都使用了令牌的方法来解决这个问题&#xff0c;在同一个时间段内&#xff0c;只有唯一一个拿到令牌…

医院信息系统集成平台—数据交换层

医院集成平台核心是数据交换总线,这解决当前大部分医院最关注的电子病历与移动医疗等业务系统接口交互共享及消息数据状态同步(消息一体化机制)等问题。集成平台主要包括业务数据集并提供相应的标准处理接口API(含数据采集与数据发布查询更新),同时提供相应的适配器服务来…

20240102使用python3将视频切片改名之后合并

20240102使用python3将视频切片改名之后合并 2024/1/2 22:12 缘起&#xff1a;将迅雷下载的视频切片排序之后再通过ffmpeg合并&#xff01;https://pri-cdn-tx.xiaoeknow.com/app1cE7gLFM1187/confusion_index/1703599111EAPoRE.m3u8?signf17e1a2cc0ddd77801f3c5110116369e&am…

C++ //习题14.2 将例14.3程序改为下面的程序,请分析执行过程,写出运行结果。并指出由于异常处理而调用了哪些析构函数。

C程序设计 &#xff08;第三版&#xff09; 谭浩强 习题14.2 习题14.2 将例14.3程序改为下面的程序&#xff0c;请分析执行过程&#xff0c;写出运行结果。并指出由于异常处理而调用了哪些析构函数。 IDE工具&#xff1a;VS2010 Note: 使用不同的IDE工具可能有部分差异。 代…

Qt:自定义一个好看的等待提示Ui控件

一、2024 永不卡顿 爱的魔力它转圈圈~ 等待样式控件是我们在做UI时出场率还挺高的控件之一&#xff0c;通常情况下有如下的几种实现方式&#xff1a; 1> 获取一张gif的资源图&#xff0c;然后使用QMovie 在一个QLabel 控件上加载显示gif的waiting等待动态。 2> 自定义绘图…

Linux 进程(五) 调度与切换

概念准备 当一个进程放在cpu上运行时&#xff0c;是必须要把进程的代码跑完才会进行下一个进程吗&#xff1f;答案肯定是 不对。现在的操作系统都是基于时间片轮转执行的。 时间片&#xff08;timeslice&#xff09;又称为“量子&#xff08;quantum&#xff09;”或“处理器片…

计算机网络【Cookie和session机制】

会话&#xff08;Session&#xff09;跟踪是Web程序中常用的技术&#xff0c;用来跟踪用户的整个会话。常用的会话跟踪技术是Cookie与Session。Cookie通过在客户端记录信息确定用户身份&#xff0c;Session通过在服务器端记录信息确定用户身份。 本章将系统地讲述Cookie与Sess…

【Pytorch】学习记录分享11——PyTorch GAN对抗生成网络

PyTorch GAN对抗生成网络 0. 工程实现1. GAN对抗生成网络结构2. GAN 构造损失函数&#xff08;LOSS&#xff09;3. GAN对抗生成网络LOSS损失函数说明 0. 工程实现 1. GAN对抗生成网络结构 2. GAN 构造损失函数&#xff08;LOSS&#xff09; LOSS公式与含义&#xff1a; LOSS…

javascript 常见工具函数(四)

31.RGB值和十六进制值之间的转换&#xff1a; &#xff08;1&#xff09;十六进制的颜色转为 RGB格式&#xff1a; /*16进制颜色转为RGB格式*/String.prototype.colorRgb function () {var sColor this.toLowerCase();if (sColor && reg.test(sColor)) {if (sColor.l…