HTML - 介绍

news2024/12/24 11:44:59

一.简介

        HTML,超文本标记语言(HyperText Markup Language),是一种用于创建网页的标准标记语言。我们可以使用HTML建立自己的WEB网站或特定页面。HTML运行在浏览器上,由浏览器解析。

⚠️注意:HTML文件的后缀为 .html 或 .htm,两者没有区别。

二.结构

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title>HTML结构</title>
    </head>
    <body>
 
        <h1>标题一</h1>
 
        <p>段落1</p>
 
    </body>
</html>

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

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

三.详解

1. 标记语言

        HTML,超文本标记语言,而不是一种编程语言。

        标记语言是一套标记标签(markup tag)。HTML使用标记标签来描述网页,HTML的文档中也包含了HTML标签以及文本内容。

2.标签

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

  • HTML 标签是由尖括号包围的关键词,比如 <html>
  • HTML 标签通常是成对出现的,比如 <b> 和 </b>
  • HTML 中存在但标签,看情况使用单标签/双标签,如<image/>,<image></image>
  • 标签对中的第一个标签是开始标签,第二个标签是结束标签
  • 开始和结束标签也被称为开放标签闭合标签

HTML 标签是由尖括号包围的关键词,而 HTML 元素则是包含了开始标签和结束标签,如下所示:

<p>段落1</p>

3.Web 浏览器

        Web浏览器(如谷歌浏览器,Internet Explorer,Firefox,Safari)是用于读取HTML文件,并将其作为网页显示。浏览器并不是直接显示的HTML标签,但可以使用标签来决定如何展现HTML页面的内容给用户。

4. 网页结构

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

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

相关文章

STM32连接阿里云物联网平台

文章目录 引言一、STM32连接阿里云物联网平台思路二、ESP8266烧录固件三、使用AT指令连接阿里云物联网平台四、STM32环形串口缓冲区驱动程序五、STM32连接阿里云驱动程序 引言 连续写了两篇关于阿里云连接的文章&#xff0c;都是使用Arduino ESP8266 & Arduino ESP32的方式…

【虚拟机数据恢复】异常断电导致虚拟机无法启动的数据恢复案例

虚拟机数据恢复环境&#xff1a; 某品牌R710服务器MD3200存储&#xff0c;上层是ESXI虚拟机和虚拟机文件&#xff0c;虚拟机中存放有SQL Server数据库。 虚拟机故障&#xff1a; 机房非正常断电导致虚拟机无法启动。服务器管理员检查后发现虚拟机配置文件丢失&#xff0c;所幸…

【论文阅读】GraspNeRF: Multiview-based 6-DoF Grasp Detection

文章目录 GraspNeRF: Multiview-based 6-DoF Grasp Detection for Transparent and Specular Objects Using Generalizable NeRF针对痛点和贡献摘要和结论引言模型框架实验不足之处 GraspNeRF: Multiview-based 6-DoF Grasp Detection for Transparent and Specular Objects Us…

Vulnhub靶场DC-9

攻击机192.168.223.128 靶机192.168.223.138 主机发现 nmap -sP 192.168.223.0/24 端口扫描 nmap -sV -p- -A 192.168.223.138 开启了22 80端口 访问一下web页面 有个查询界面 测试发现存在post型的sql注入 用sqlmap跑一下&#xff0c;因为是post型的&#xff0c;这里…

C#使用RabbitMQ-1_Docker部署并在c#中实现简单模式消息代理

介绍 RabbitMQ是一个开源的消息队列系统&#xff0c;实现了高级消息队列协议&#xff08;AMQP&#xff09;。 &#x1f340;RabbitMQ起源于金融系统&#xff0c;现在广泛应用于各种分布式系统中。它的主要功能是在应用程序之间提供异步消息传递&#xff0c;实现系统间的解耦和…

RabbitMQ问题总结

:::info 使用场景 异步发送&#xff08;验证码、短信、邮件。。。&#xff09;MySQL 和 Redis、ES 之间的数据同步分布式事务削峰填谷… ::: 如何保证消息不丢失 上图是消息正常发送的一个过程&#xff0c;那在哪个环节中消息容易丢失&#xff1f;在哪一个环节都可能丢失 生…

Ubuntu20.4 Mono C# gtk 编程习练笔记(四)

连续实时绘图 图看上去不是很清晰&#xff0c;KAZAM录屏AVI尺寸80MB&#xff0c; 转换成gif后10MB, 按CSDN对GIF要求&#xff0c;把它剪裁缩小压缩成了上面的GIF&#xff0c;图像质量大不如原屏AVI&#xff0c;但应该能说明原意&#xff1a;随机数据随时间绘制在 gtk 的 drawin…

使用OpenCV实现一个简单的实时人脸跟踪

简介&#xff1a; 这个项目将通过使用OpenCV库来进行实时人脸跟踪。实时人脸跟踪是一项在实际应用中非常有用的技术&#xff0c;如视频通话、智能监控等。我们将使用OpenCV中的VideoCapture()函数来读取视频流&#xff0c;并使用之前加载的Haar特征级联分类器来进行人脸跟踪。 …

浅谈Python两大爬虫库——urllib库和requests库区别

目录 一、urllib库 1、使用方法 2、功能 3、效率 二、requests库 1、使用方法 2、功能 3、效率 三、总结与建议 在Python中&#xff0c;网络爬虫是一个重要的应用领域。为了实现网络爬虫&#xff0c;Python提供了许多库来发送HTTP请求和处理响应。其中&#xff0c;url…

MySql8的简单使用(1.模糊查询 2.group by 分组 having过滤 3.JSON字段的实践)

MySql8的简单使用&#xff08;1.模糊查询 2.group by 分组 having过滤 3.JSON字段的实践&#xff09; 一.like模糊查询、group by 分组 having 过滤 建表语句 create table student(id int PRIMARY KEY,name char(10),age int,sex char(5)); alter table student add height…

【Linux C | 网络编程】入门知识:TCP协议、TCP客户端、TCP服务端

&#x1f601;博客主页&#x1f601;&#xff1a;&#x1f680;https://blog.csdn.net/wkd_007&#x1f680; &#x1f911;博客内容&#x1f911;&#xff1a;&#x1f36d;嵌入式开发、Linux、C语言、C、数据结构、音视频&#x1f36d; &#x1f923;本文内容&#x1f923;&a…

MySQL 数据库 JDBC 简化 JDBCTemplate

JDBCTemplate编程 场景&#xff1a;使用JdbcTemplate技术向MySQL中插入一条数据 表结构如下 create table t_person(person_id int primary key auto_increment,person_name varchar(20),age tinyint,sex enum(男,女,奥特曼),height decimal(4,1),birthday datetime ) AP…

勤学苦练“prompts“,如沐春风“CodeArts Snap“

前言 CodeArts Snap 上手一段时间了&#xff0c;对编程很有帮助。但是&#xff0c;感觉代码编写的不尽人意。 我因此也感到困惑&#xff0c;想要一份完整的 CodeArts Snap 手册看看。 就在我感觉仿佛"独自彷徨在这条悠长、悠长又寂寥的雨巷"时&#xff0c;我听了大…

Ubuntu+Apache+MySQL+PHP+phpstorm+xdebug下的debug环境搭建(纯小白笔记)

关键词 一、win10双系统装Ubuntu&#xff08;Deepin&#xff09; 参考文章&#xff1a; https://www.cnblogs.com/masbay/p/11627727.html 1.1 首先需要确定自己操作系统的引导方式 1.1.1 查看BIOS模式 “winr"快捷键进入"运行”&#xff0c;输入"msinfo32…

微软 AD |域控制器 | 组件 | 域服务 | 对象解析

介绍 Active Directory&#xff08;AD&#xff09;&#xff0c;是微软的目录服务&#xff0c;提供强大的功能和管理体系&#xff0c;用于组织管理和安全存储网络上的资源和用户、计算机、服务对象等信息。 AD 功能&#xff1a; 身份验证和访问控制&#xff1a; 提供集中式的身…

2024 高级前端面试题之 CSS 「精选篇」

该内容主要整理关于 CSS 的相关面试题&#xff0c;其他内容面试题请移步至 「最新最全的前端面试题集锦」 查看。 CSS模块精选篇 1. 盒模型2. BFC3. 层叠上下文4. 居中布局5. 选择器权重计算方式6. 清除浮动7. link 与 import 的区别8. CSS3的新特性9. CSS动画和过渡10. 有哪些…

Mac中java jdk、android sdk、flutter sdk目录

1、Java JDK 目录 &#xff08;1&#xff09;官网下载的 Java JDK Java JDK下载官网 /Library/Java/JavaVirtualMachines&#xff08;2&#xff09;Android Studio下载的 Java JDK /Users/用户名/Library/Java/JavaVirtualMachines2、Android SDK 目录 /Users/用户名/Libr…

以梦为码,CodeArts Snap 缩短我与算法的距离

背景 最近一直在体验华为云的 CodeArts Snap&#xff0c;逐渐掌握了使用方法&#xff0c;代码自动生成的准确程度大大提高了。 自从上次跟着 CodeArts Snap 学习用 Python 编程&#xff0c;逐渐喜欢上了 Python。 我还给 CodeArts Snap 起了一个花名&#xff1a; 最佳智能学…

SQL注入实战:二阶注入

一、二阶注入的原理 1、二阶注入也称为SOL二次注入。 2、二次注入漏洞是一种在Web应用程序中广泛存在的安全漏洞形式:相对于一次注入漏洞而言&#xff0c;二次注入漏洞更难以被发现&#xff0c;但是它却具有与一次注入攻击漏洞相同的攻击威力。 3、简单的说&#xff0c;二次…

GitHub国内打不开(解决办法有效)

最近国内访问github.com经常打不开&#xff0c;无法访问。 github网站打不开的解决方法 1.打开网站http://tool.chinaz.com/dns/ &#xff0c;在A类型的查询中输入 github.com&#xff0c;找出最快的IP地址。 2.修改hosts文件。 在hosts文件中添加&#xff1a; # localhost n…