一、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>

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

多模型DCA曲线:如何展现和解读乳腺癌风险评估模型的多样性和鲁棒性?

一、引言 乳腺癌是女性常见的恶性肿瘤之一&#xff0c;对女性的身体健康和生命安全产生了重要影响。早期诊断和风险评估可以帮助医生和患者制定更好的治疗方案&#xff0c;并提高治愈率和生存率。因此&#xff0c;乳腺癌风险评估模型的研究和应用变得越来越重要。 在乳腺癌风险…

【已解决】打印PDF文件,如何跳过不需要的页面?

打印PDF文件的时候&#xff0c;有时候我们只需要打印其中的几页&#xff0c;并不需要全部打印&#xff0c;那如何在打印时跳过那些不需要的页面呢&#xff1f;不清楚的小伙伴一起来看看吧&#xff01; 如果你是通过网页打开PDF文件&#xff0c;那么可以在页面中找到并点击“打…

页面间动画之放大缩小视图

目录 1、Exchange类型的共享元素转场 2、Static类型的共享元素转场 3、场景示例 在不同页面间&#xff0c;有使用相同的元素&#xff08;例如同一幅图&#xff09;的场景&#xff0c;可以使用共享元素转场动画衔接。为了突出不同页面间相同元素的关联性&#xff0c;可为它们…

【webstorm中通过附加方式打开一个项目,这个项目本身有git,但是却看不到git的解决方法】

1、如图所示 设置-》版本控制-》未注册的根&#xff0c;选中后&#xff0c;再点加号&#xff0c;就可以了 2、如图所示 版本控制-》直接点加号-》选中项目路径&#xff0c;vcs选择git&#xff0c;点击确定就可以了

算法分析与设计 第一次课外作业

算法分析与设计 第一次课外作业 文章目录 算法分析与设计 第一次课外作业一. 单选题&#xff08;共8题&#xff0c;80分&#xff09;二. 判断题&#xff08;共2题&#xff0c;20分&#xff09; 一. 单选题&#xff08;共8题&#xff0c;80分&#xff09; (单选题)以下叙述中错误…

阶段五-JavaWeb综合练习-学生管理系统

一.项目说明 1.前台 (用户使用) 前端,后端 2.后台 (管理员使用) 前端,后端 3.该项目为后台管理系统 项目开发流程: 1.需求分析 1.1 登录功能 用户访问登录页面输入用户名和密码,并且输入验证码。全部输入正确后点击登录&#xff0c;登录成功跳转主页面&#xff1b;登录…

三、HTML元素

一、HTML元素 HTML 文档由 HTML 元素定义。 *开始标签常被称为起始标签&#xff08;opening tag&#xff09;&#xff0c;结束标签常称为闭合标签&#xff08;closing tag&#xff09;。 二、HTML 元素语法 HTML 元素以开始标签起始。HTML 元素以结束标签终止。元素的内容是…

常见安全概念澄清,Java小白入门(八)

认证 认证 (Identification) 是验证当前用户的身份。 常见的认证技术&#xff1a; 身份证用户名和密码用户手机&#xff1a;手机短信、手机二维码扫描、手势密码用户的电子邮箱用户的生物学特征&#xff1a;指纹、语音、眼睛虹膜 授权 授权 (Authorization) 指赋予用户系统…

【OpenCV】在MacOS上源码编译OpenCV

在MacOS上源码编译OpenCV 1. 下载项目源码2. 创建CMake编译文件3. 编译安装4. 案例测试5. 总结 前言 在做视觉任务时&#xff0c;我们经常会用到开源视觉库OpenCV&#xff0c;OpenCV是一个基于Apache2.0许可&#xff08;开源&#xff09;发行的跨平台计算机视觉和机器学习软件…

【docker实战】安装tomcat并连接mysql数据库

本节用docker来安装tomcat&#xff0c;并用这个tomcat连接我们上一节安装好的mysql数据库 一、拉取镜像 我们安装8.5.69版本 先搜索一下 [rootlocalhost ~]# docker search tomcat NAME DESCRIPTION …

CRLF注入与检测

一、CRLF介绍 CRLF是CR和LF两个字符的拼接&#xff0c;它们 分别代表”回车换行”&#xff08;\r\n&#xff09;。十六进制编码分别为0x0d和0x0a&#xff0c;URL编码为%0D和%0A。CR和LF组合在一起即CRLF命令&#xff0c;它表示键盘上的"Enter"键&#xff0c;许多应用…

如何避免LLM的“幻觉”(Hallucination)

生成式大语言模型&#xff08;LLM&#xff09;可以针对各种用户的 prompt 生成高度流畅的回复。然而&#xff0c;大模型倾向于产生幻觉或做出非事实陈述&#xff0c;这可能会损害用户的信任。 大语言模型的长而详细的输出看起来很有说服力&#xff0c;但是这些输出很有可能是虚…

postman设置下载文件大小限制

问题 本地写了一个下载文件的接口&#xff0c;调用postman测试的时候&#xff0c;小文件可以&#xff0c;但时大文件就会报错&#xff0c;postman提示&#xff1a; 解决方案 点击postman的设置按钮&#xff0c;点击【Settings】&#xff0c;在打开的弹窗中选择【General】Tab…

【Spark精讲】记一个SparkSQL引擎层面的优化:SortMergeJoinExec

SparkSQL的Join执行流程 如下图所示&#xff0c;在分析不同类型的Join具体执行之前&#xff0c;先介绍Join执行的基本框架&#xff0c;框架中的一些概念和定义是在不同的SQL场景中使用的。 在Spark SQL中Join的实现都基于一个基本的流程&#xff0c;根据角色的不同&#xff0…

解析大语言模型LLM的幻觉问题:消除错觉、提高认知

文章目录 前言一、幻觉介绍二、幻觉产生的原因三、幻觉的现象四、幻觉的分类五、幻觉解决方案六、幻觉待解决问题后记 前言 在人类的感知和认知过程中&#xff0c;幻觉一直是一个被广泛讨论和研究的问题。幻觉指的是一种虚假的感知或认知经验&#xff0c;使我们看到、听到或感…

如何选择适合你的跨境电商源码?10大要点全解析

跨境电商源码是开展跨境电商业务的关键工具&#xff0c;它直接关系到电商网站的功能性和性能表现。如何选择适合自己的跨境电商源码成为了许多网商关注的焦点。本文将从多个维度全面解析如何选择适合你的跨境电商源码&#xff0c;为你的跨境电商之路提供有力支持。 关键点一&a…

大数据应用安全策略包括什么

大数据应用安全策略是为了保障大数据应用中的数据安全而采取的一系列措施&#xff0c;其重要性不容小觑。以下是大数据应用安全策略所包含的主要内容&#xff1a; 一、数据加密与安全存储 数据加密&#xff1a;对于敏感数据&#xff0c;应采用加密技术进行保护&#xff0c;包括…

【代数学作业4-汇总版】范数与迹

【代数学作业4】范数与迹 写在最前面1. 极小多项式1. 对 α \alpha α 的极小多项式2. 对 α 1 \alpha 1 α1 的极小多项式3. 对 α 2 α 1 \alpha^2 \alpha 1 α2α1 的极小多项式 2. 范数 N N N3. 数域 K K K 的范数 N K N_K NK​4. 迹 T T T5. 数域 K K K 的迹…

基于电商场景的高并发RocketMQ实战-促销活动推送至用户完整流程、Spring结合RocketMQ的生产者消费者使用

&#x1f308;&#x1f308;&#x1f308;&#x1f308;&#x1f308;&#x1f308;&#x1f308;&#x1f308; 欢迎关注公众号&#xff08;通过文章导读关注&#xff09;&#xff0c;发送【资料】可领取 深入理解 Redis 系列文章结合电商场景讲解 Redis 使用场景、中间件系列…