当前位置: 首页 > news >正文

一文读懂HTML

文章目录

  • HTML的历史
  • HTML的作用
  • HTML的基本语言

在这里插入图片描述

HTML的历史

HTML(HyperText Markup Language)的历史可以追溯到20世纪90年代早期,它是互联网发展的重要里程碑之一。以下是HTML的历史概述:

  • 早期阶段(1980年代末 - 1990年代初):在互联网的早期阶段,人们开始意识到需要一种标记语言来创建和共享文档。这导致了Tim Berners-Lee在1989年至1991年间开发了最早的HTML版本,用于创建超文本文档。

  • HTML 2.0(1995年):HTML 2.0是第一个被广泛采用的HTML标准,它引入了一些基本的标记和结构,如标题、段落、列表等。这个版本为网页的结构和内容提供了基本的定义。

  • HTML 3.2(1997年):HTML 3.2是一个重要的里程碑,引入了许多新的标签和功能,如表格、图像、表单等。这个版本使得网页的设计和布局更加丰富和灵活。

  • HTML 4.01(1999年):HTML 4.01进一步扩展了HTML的功能,引入了样式表、脚本和框架等新特性。这个版本为网页的外观和交互提供了更多的控制。

  • XHTML(2000年):XHTML(可扩展超文本标记语言)是HTML的一个严格版本,基于XML语法。它的目标是使HTML更加规范和可扩展,提高网页的可访问性和可靠性。

  • HTML5(2014年):HTML5是HTML的最新版本,引入了许多新的标签、API和功能,如音频、视频、画布、地理定位等。HTML5的出现使得网页开发更加灵活和强大,支持多媒体、动画和交互性的增强。

HTML的发展是与互联网的发展紧密相连的,它不断演进和改进,以适应不断变化的技术和用户需求。随着移动设备和云计算的兴起,HTML的重要性进一步提升,成为构建跨平台和响应式网页的核心技术之一。

HTML的作用

HTML的作用是定义和组织网页的结构和内容。它是构建网页的基础,通过使用HTML标签和属性,可以创建文本、图像、链接、表格、表单等元素,使网页具有丰富的内容和交互功能。

具体来说,HTML的作用包括以下几个方面:

  • 结构化网页:HTML标签定义了网页的结构,如标题、段落、列表、表格等。这些标签使得网页的内容有条理,易于阅读和理解。

  • 插入图像和媒体:通过HTML的< img>标签,可以在网页中插入图像,使网页更加生动和吸引人。此外,HTML还支持插入音频、视频等多媒体元素,丰富了网页的内容和表现形式。

  • 创建链接:HTML的< a>标签用于创建超链接,可以将一个网页与另一个网页或文件进行关联。这样,用户可以通过点击链接跳转到其他页面,实现网页之间的导航和跳转。

  • 构建表单:HTML的表单元素(如< form>、< input>、< select>等)用于收集用户输入的数据。通过表单,用户可以提交信息、进行搜索、注册账号等操作,实现与用户的交互。

  • 定义元数据:HTML的< head>标签中可以包含元数据,如标题、描述、关键词等。这些元数据对搜索引擎优化(SEO)和网页的可访问性非常重要,有助于提高网页在搜索结果中的排名和用户体验。

总之,HTML是构建网页的基础语言,它定义了网页的结构和内容,使得网页具有丰富的表现形式和交互功能。通过使用HTML,我们可以创建各种各样的网页,满足不同用户的需求,并实现信息的传递和共享。

HTML的基本语言

HTML:超文本标记语言 HTML是一种用于创建网页的标记语言。它使用标签来定义网页的结构和内容。下面是一些常用的HTML标签及其用途:

  • < html>:定义HTML文档的根元素。
  • < head>:定义文档的头部,包含一些元数据,如标题、样式表和脚本等。
  • < title>:定义文档的标题,显示在浏览器的标题栏中。
  • < body>:定义文档的主体部分,包含网页的内容。
  • < h1>到< h6>:定义标题,从大到小依次表示不同级别的标题。
  • < p>:定义段落,用于包裹文本内容。
  • < a>:定义超链接,用于创建指向其他网页或文件的链接。
  • < img>:定义图像,用于在网页中插入图片。
  • < ul>和< li>:定义无序列表,用于显示项目的列表。
  • < ol>和< li>:定义有序列表,用于显示按顺序排列的项目。
  • < table>、< tr>和< td>:定义表格,用于展示数据。
  • < form>、< input>和< button>:定义表单,用于用户输入和提交数据。
    除了上述标签,HTML还有许多其他标签,用于创建更复杂的网页结构和功能。你可以通过嵌套标签来创建更复杂的布局和交互。

HTML标签通常是成对出现的,有一个开始标签和一个结束标签。开始标签用尖括号包围,结束标签在开始标签的基础上加上斜杠。例如,< p>是一个开始标签,< /p>是一个结束标签。

在标签中,可以使用属性来提供额外的信息。属性通常包含在开始标签中,由属性名和属性值组成。例如,< a href=“https://www.example.com”> 中的href是一个属性,它指定了链接的目标网址。

HTML是一种易于学习和使用的语言,它为网页提供了结构和内容。通过学习和使用HTML,你可以创建自己的网页,并与全世界的人们分享你的想法和信息。

相关文章:

一文读懂HTML

文章目录 HTML的历史HTML的作用HTML的基本语言 HTML的历史 HTML&#xff08;HyperText Markup Language&#xff09;的历史可以追溯到20世纪90年代早期&#xff0c;它是互联网发展的重要里程碑之一。以下是HTML的历史概述&#xff1a; 早期阶段&#xff08;1980年代末 - 1990年…...

MOCK测试

介绍 mock&#xff1a;就是对于一些难以构造的对象&#xff0c;使用虚拟的技术来实现测试的过程。 mock测试&#xff1a;在测试过程中&#xff0c;对于某些不容易构造或者不容易获取的对象&#xff0c;可以用一个虚拟的对象来代替的测试方 法。 接口Mock测试&#xff1a;在接口…...

Flutter源码分析笔记:Widget类源码分析

Flutter源码分析笔记 Widget类源码分析 - 文章信息 - Author: 李俊才 (jcLee95) Visit me at: https://jclee95.blog.csdn.netEmail: 291148484163.com. Shenzhen ChinaAddress of this article:https://blog.csdn.net/qq_28550263/article/details/132259681 【介绍】&#x…...

PyTorch 微调终极指南:第 2 部分 — 提高模型准确性

一、说明 如今&#xff0c;在训练深度学习模型时&#xff0c;通过在自己的数据上微调预训练模型来迁移学习已成为首选方法。通过微调这些模型&#xff0c;我们可以利用他们的专业知识并使其适应我们的特定任务&#xff0c;从而节省宝贵的时间和计算资源。本文分为四个部分&…...

MySQL数据库----------安装anaconda---------python与数据库的链接

作者前言 &#x1f382; ✨✨✨✨✨✨&#x1f367;&#x1f367;&#x1f367;&#x1f367;&#x1f367;&#x1f367;&#x1f367;&#x1f382; ​&#x1f382; 作者介绍&#xff1a; &#x1f382;&#x1f382; &#x1f382; &#x1f389;&#x1f389;&#x1f389…...

nuxt页面布局

nuxt页面默认布局文件在layouts目录下default.vue&#xff0c;可将页面的头部和脚部提取出来&#xff0c;形成布局页&#xff0c;将主内容区域的内容替换成<nuxt />。附default.vue代码&#xff1a; <template><div class"app-container"><div…...

mac编译ffmpeg

- code&#xff1a; git clone https://git.ffmpeg.org/gitweb/ffmpeg.git - 编译安装 https://trac.ffmpeg.org/wiki/CompilationGuide - 使用homebrew安装dependency brew install automake fdk-aac git lame libass libtool libvorbis libvpx \ opus sdl shtool texi2ht…...

如何让你的图片服务也有类似OSS的图片处理功能

原文链接 前言 有自己机房的公司一般都有一套存储系统用于存储公司的图片、视频、音频、文件等数据&#xff0c;常见的存储系统有以NAS、FASTDFS为代表的传统文件存储&#xff0c;和以Minio为代表的对象存储系统&#xff0c;随着云服务的兴起很多公司逐渐将数据迁移到以阿里云…...

Oracle PL/SQL 类型(Type):索引表、嵌套表、变长数组、pipelined 管道

1、Oracle 新建员工表和部门表.sql。 集合类型 1、Oracle 集合是相同类型元素的组合&#xff0c;在集合中&#xff0c;使用唯一的下标来标识其中的每个元素&#xff0c;与 Java 的 List 很像。 2、常用集合方式&#xff1a; 类型语法下标元素个数初始值.extend能否存在DB中…...

Web 服务器 -【Tomcat】的简单学习

Tomcat1 简介1.1 什么是Web服务器 2 基本使用2.1 下载2.2 安装2.3 卸载2.4 启动2.5 关闭2.6 配置2.7 部署 3 Maven创建Web项目3.1 Web项目结构3.2 创建Maven Web项目 4 IDEA使用Tomcat4.1 集成本地Tomcat4.2 Tomcat Maven插件 Tomcat 1 简介 1.1 什么是Web服务器 Web服务器是…...

armbian使用1panel快速部署部署springBoot项目后端

文章目录 前言环境准备实现步骤第一步&#xff1a;Armbian安装1panel第二步&#xff1a;安装数据库第三步&#xff1a;查看数据库容器重要信息【重要】查看容器所在的网络查看容器连接地址 第四步&#xff1a;项目配置和打包第五步:构建项目镜像 前言 这里只是简单记录部署spr…...

Streamlit 讲解专栏(八):图像、音频与视频魔法

文章目录 1 前言2 st.image&#xff1a;嵌入图像内容2.1 图像展示与描述2.2 调整图像尺寸2.3 使用本地文件或URL 3 st.audio&#xff1a;嵌入音频内容3.1 播放音频文件3.2 生成音频数据播放 4 st.video&#xff1a;嵌入视频内容4.1 播放视频文件4.2 嵌入在线视频 5 结语&#x…...

python使用装饰器记录方法耗时

思路 python使用修饰器记录方法耗时&#xff0c;目的是每当方法执行完后&#xff0c;可以记录该方法耗时&#xff0c;而不需要在每个方法的执行前后&#xff0c;去创建一个临时变量&#xff0c;来记录耗时。 方式一&#xff08;不推荐&#xff09;&#xff1a; 在每个方法的…...

JavaWeb课程学习--Day01

HTML 建立css文件&#xff1a; css使用方式&#xff1a; <span>...</span>无语意包裹标签 css中的三种选择器&#xff1a; 注意&#xff1a;播放视音频时要留出播放空间 盒子模型&#xff1a; 表格标签&#xff1a; 以上表格&#xff1a; 表单标签&#xff1a; 表…...

Spring Boot单元测试使用MockBean注解向Service注入Mock对象

1. 背景介绍 我们在测试时有一个Service&#xff0c;我们需要测试Service&#xff0c;但Service内部依赖ServiceA、ServiceB&#xff0c;此时我们希望Mock ServiceA&#xff0c;ServiceB 注入真实对象。 class Service {private ServiceA A;private ServiceB B;public int me…...

Java中使用instanceof判断对象类型

记录&#xff1a;470 场景&#xff1a;Java中使用instanceof判断对象类型。例如在解析JSON字符串转换为指定类型时&#xff0c;先判断类型&#xff0c;再定向转换。在List<Object>中遍历Object时&#xff0c;先判断类型&#xff0c;再定向转换。 版本&#xff1a;JDK 1…...

postman测试后端增删改查

目录 一、本文介绍 二、准备工作 &#xff08;一&#xff09;新建测试 &#xff08;二&#xff09;默认url路径查看方法 三、增删改查 &#xff08;一&#xff09;查询全部 &#xff08;二&#xff09;增加数据 &#xff08;三&#xff09;删除数据 &#xff08;四&…...

根据源码,模拟实现 RabbitMQ - 通过 SQLite + MyBatis 设计数据库(2)

目录 一、数据库设计 1.1、数据库选择 1.2、环境配置 1.3、建库建表接口实现 1.4、封装数据库操作 1.5、针对 DataBaseManager 进行单元测试 一、数据库设计 1.1、数据库选择 MySQL 是我们最熟悉的数据库&#xff0c;但是这里我们选择使用 SQLite&#xff0c;原因如下&am…...

1、基于 CentOS 7 构建 LVS-DR 群集。 2、配置nginx负载均衡

一、基于CentOS7和、构建LVS-DR群集 准备四台虚拟机 ip作用192.168.27.150客户端192.168.27.151LVS192.168.27.152RS192.168.27.152RS 关闭防火墙 [rootlocalhost ~]# systemctl stop firewalld安装ifconfig yum install net-tools.x86_64 -y1、DS上 1.1 配置LVS虚拟IP …...

android 如何分析应用的内存(十七)——使用MAT查看Android堆

android 如何分析应用的内存&#xff08;十七&#xff09;——使用MAT查看Android堆 前一篇文章&#xff0c;介绍了使用Android profiler中的memory profiler来查看Android的堆情况。 如Android 堆中有哪些对象&#xff0c;这些对象的引用情况是什么样子的。 可是我们依然面临…...

JavaSec-RCE

简介 RCE(Remote Code Execution)&#xff0c;可以分为:命令注入(Command Injection)、代码注入(Code Injection) 代码注入 1.漏洞场景&#xff1a;Groovy代码注入 Groovy是一种基于JVM的动态语言&#xff0c;语法简洁&#xff0c;支持闭包、动态类型和Java互操作性&#xff0c…...

OpenLayers 可视化之热力图

注&#xff1a;当前使用的是 ol 5.3.0 版本&#xff0c;天地图使用的key请到天地图官网申请&#xff0c;并替换为自己的key 热力图&#xff08;Heatmap&#xff09;又叫热点图&#xff0c;是一种通过特殊高亮显示事物密度分布、变化趋势的数据可视化技术。采用颜色的深浅来显示…...

SkyWalking 10.2.0 SWCK 配置过程

SkyWalking 10.2.0 & SWCK 配置过程 skywalking oap-server & ui 使用Docker安装在K8S集群以外&#xff0c;K8S集群中的微服务使用initContainer按命名空间将skywalking-java-agent注入到业务容器中。 SWCK有整套的解决方案&#xff0c;全安装在K8S群集中。 具体可参…...

vscode(仍待补充)

写于2025 6.9 主包将加入vscode这个更权威的圈子 vscode的基本使用 侧边栏 vscode还能连接ssh&#xff1f; debug时使用的launch文件 1.task.json {"tasks": [{"type": "cppbuild","label": "C/C: gcc.exe 生成活动文件"…...

(二)TensorRT-LLM | 模型导出(v0.20.0rc3)

0. 概述 上一节 对安装和使用有个基本介绍。根据这个 issue 的描述&#xff0c;后续 TensorRT-LLM 团队可能更专注于更新和维护 pytorch backend。但 tensorrt backend 作为先前一直开发的工作&#xff0c;其中包含了大量可以学习的地方。本文主要看看它导出模型的部分&#x…...

理解 MCP 工作流:使用 Ollama 和 LangChain 构建本地 MCP 客户端

&#x1f31f; 什么是 MCP&#xff1f; 模型控制协议 (MCP) 是一种创新的协议&#xff0c;旨在无缝连接 AI 模型与应用程序。 MCP 是一个开源协议&#xff0c;它标准化了我们的 LLM 应用程序连接所需工具和数据源并与之协作的方式。 可以把它想象成你的 AI 模型 和想要使用它…...

Qt Http Server模块功能及架构

Qt Http Server 是 Qt 6.0 中引入的一个新模块&#xff0c;它提供了一个轻量级的 HTTP 服务器实现&#xff0c;主要用于构建基于 HTTP 的应用程序和服务。 功能介绍&#xff1a; 主要功能 HTTP服务器功能&#xff1a; 支持 HTTP/1.1 协议 简单的请求/响应处理模型 支持 GET…...

解决本地部署 SmolVLM2 大语言模型运行 flash-attn 报错

出现的问题 安装 flash-attn 会一直卡在 build 那一步或者运行报错 解决办法 是因为你安装的 flash-attn 版本没有对应上&#xff0c;所以报错&#xff0c;到 https://github.com/Dao-AILab/flash-attention/releases 下载对应版本&#xff0c;cu、torch、cp 的版本一定要对…...

css3笔记 (1) 自用

outline: none 用于移除元素获得焦点时默认的轮廓线 broder:0 用于移除边框 font-size&#xff1a;0 用于设置字体不显示 list-style: none 消除<li> 标签默认样式 margin: xx auto 版心居中 width:100% 通栏 vertical-align 作用于行内元素 / 表格单元格&#xff…...

【Oracle】分区表

个人主页&#xff1a;Guiat 归属专栏&#xff1a;Oracle 文章目录 1. 分区表基础概述1.1 分区表的概念与优势1.2 分区类型概览1.3 分区表的工作原理 2. 范围分区 (RANGE Partitioning)2.1 基础范围分区2.1.1 按日期范围分区2.1.2 按数值范围分区 2.2 间隔分区 (INTERVAL Partit…...