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

html标签表示！

news 2025/7/6 10:19:48

  1. html是什么？

HTML全称为超文本标记语言，是一种标记语言。包括一系列标签，通过这些标签可以将网络上的文档格式统一，使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等。

超文本是一种组织信息的方式，它通过超级链接方法将文本中的文字、图表与其他信息媒体相关联。

2.学习html可以做什么？

html作用是将网页使用代码实现，并且将网页的各个部分添加模块，需要的时候给模块添加颜色和大小等操作。

　　html是一种静态网页，很多网站都是动静结合的，当然html是网页的基础知识，学习前端一定要先学习html，把html基本知识学扎实，然后就可以写出各种静态网页，再去学习动态网页。

html基础内容

  1. 标签之间的关系?

标签之间的关系分为两种：

父子关系（嵌套关系）：<head> 与<title>等

兄弟关系（并列关系）：同级关系 <head> 与<body>

标签分为单标签和双标签

  1. 标题标签

标题标签从h1-h6 逐渐减小

标签的特点：

文字都有粗体

文字独占一行

文字都有变大，从h1-h6逐渐减小

  1. 其他标签

换行标签：br 解释：单标签 让文字或者图片强制换行

水平线标签：hr 解释：加上水平线 会随着网页的大小随之变化

  1. 文本标签

段落标签：p

文本标签：text

标签格式的介绍：

标签

说明

b/strong(强调语义)

加粗

u/ins

下划线

i/em

倾斜

s/del

删除线

  1. 图片标签

使用场景：在网页中显示图片 单标签

代码：<img src=" 图片的路径 " alt=" ">

src=“ ”标签属性 属性名=“属性值”

alt替换文本

当图片没有显示出来就，才会加载的alt文本

当图片加载处理啊，不会显示，会自动被图片遮盖

title 提示文本

当鼠标悬停的时候，才会显示文本；title不仅可以在图片中使用，也可以在其他标签中使用

width和height属性

图片的宽高

如果知识设置了其中一个属性 另一个属性会自动等比例缩放（图片不会）

如果同时设置了两个属性，若设置不当会造成图片变形

属性注意点：

  1. 标签属性写在开始标签中

  1. 标签上可以同时存在多个属性

  1. 属性之间空格隔开

  1. 标签与属性之间必须使用空格隔开

  1. 属性之间没有顺序

  1. 音频视频标签

场景：在页面中插入音频或者视频

音频标签

代码：<audio src="/音频的路径" controls></audio>

常见的属性：

src 音频的路径

controls 显示播放的控件

autoplay 自动播放（部分浏览器不支持）

loop 循环播放

音频只支持：map3，wav，ogg格式

视频标签

代码：<audio src="/音频的路径" controls></audio>

常见的属性：

src 音频的路径

controls 显示播放的控件

autoplay 自动播放（谷歌浏览器需要配合muted实现静音效果）

loop 循环播放

视频支持：MP4，webm，ogg格式

  1. 路径

绝对路径：目录下的绝对路径位置，可以直接达到目标位置，通常从盘符开始的路径

相对路径：从当前文件开始寻找目标文件的过程

相对路径的分类：

  • 同级目录

  • 下级目录

  • 上级目录

./”：表示当前的文件所在的目录。

“../”：表示当前的文件所在的上一层的目录。

“/”：表示当前的文件所在的根目录。

方法一：<img src="目标图片.gif>

方法二：<img src="./目标图片.gif>

图片的格式：常用的是.jpg或.jpeg gif是动图的格式

  1. 链接标签

场景：点击事件后跳转到另一个页面

a标签 ，超链接

代码：<a href="./跳转的页面.html">文本描述</a>

双标签，内部可以包裹使用，点击跳转指定的页面，需要设置a标签的href属性

target属性名：属性值（目标网页的打开形式）

属性值：

_self：默认值，在当前窗口中跳转（覆盖当前页面）

_blank：在新窗口中跳转（保留原来的页面）

例句：<a href="https://www.baidu.com/" target="_blank">百度</a>

  1. 列表标签

种类：无序列表，有序列表，自定义列表

特点：按照行的方式，整齐显示内容

无序列表：

场景：在网页中表示一组无顺序之分的列表，如：新闻列表

标签组成：

标签名

说明

ul

表示无序列表的整体，用于包裹li标签

li

表示无序列表的每一项，包含每一行的内容

显示特点

列表的每一项前默认显示的圆点标识

特点

ul标签中只允许包括li标签

li标签可以包含任意标签

有序列表：

在网页中表示一组由顺序之分的列表

标签组成：

标签名

说明

ol

表示有序列表的整体，用于包裹li标签

li

表示有序列表的每一项，包含每一行的内容

显示特点

列表中的每一项前默认显示序号标识

特点

ol标签中只允许包括li标签

li标签可以包含任意标签

自定义标签

场景：在网页的底部导航中通常会使用自定义列表实现

标签组成：

标签名

说明

dl

表示自定义列表的整体，用于包裹dt/dd标签

dt

表示自定义列表的主题

dd

表示自定义的针对主题的每一项内容

特点

dd前会默认显示缩进效果

注意

dl标签中只允许包括dt/dd标签

dt/dd标签可以包含任意内容

  1. 表格标签

表格标题和表头单元格标签

场景：在表格中表示整体大标题和一列小标题

其他标签：

标签名

名称

说明

caption

表格大标题

表示表格整体大标题，默认在表格整体顶部居中位置显示

th

表格单元格

表示一列小标题，通常用于表格第一行，默认文字加粗并居中显示

caption标签写在table标签内部

th标签书写tr标签内部（用于替换td标签）

相关文章：

html标签表示！

html是什么&#xff1f;HTML全称为超文本标记语言&#xff0c;是一种标记语言。包括一系列标签&#xff0c;通过这些标签可以将网络上的文档格式统一&#xff0c;使分散的Internet资源连接为一个逻辑整体。HTML文本是由HTML命令组成的描述性文本&#xff0c;HTML命令可以说明文…...

编程日记 2023/3/10 9:49:57

前端优化，webpack打包删除无用文件，并附上批量删除文件脚本！非常好用

前言 大家可能在webpack打包项目过程中&#xff0c;常遇见一些无用的图片&#xff0c;js文件&#xff0c;怎样能够自动检测哪些是无用的文件呢&#xff1f;本文中介绍使用插件useless-files-webpack-plugin查找无用文件&#xff0c;在terminal中删除&#xff0c;附加bat批量删…...

编程日记 2023/3/10 9:48:53

SpringCloud之 LoadBalancer负载均衡

文章目录LoadBalancer 负载均衡一、LoadBalanced 负载均衡&#x1f33d;①观察负载均衡现象&#x1f33d;②LoadBalanced 源码剖析二、自定义负载均衡三、OpenFeign 实现负载均衡&#x1f346;①添加依赖&#x1f346;②启动类添加 EnableFeignClients&#x1f346;③创建客户端…...

编程日记 2023/3/10 9:47:50

idm如何下载种子文件和磁力链接 idm如何下载torrent

采用分段式下载技术并支持断点续传的idm下载加速器&#xff0c;几乎可以胜任所有的下载任务。由于该软件强大的下载能力和仅为10MB的小巧体积&#xff0c;idm被来自全球的用户亲切地称为天花板级的下载软件。那么有关idm如何下载种子文件和磁力链接&#xff0c;idm如何下载torr…...

编程日记 2023/3/10 9:46:46

UE4 安卓AR 识别图片

UE4 安卓AR 识别图片 开启一个插件 准备一个只有玩家出生点的场景&#xff0c;这个场景用来做识别图片的 新建一个游戏模式&#xff0c;设置好默认的pawn类&#xff1a; 一个摄像机就行了&#xff0c;代表手机开启AR会话后的那个相机 然后gamemode 事件开始运行&#xff0…...

编程日记 2023/3/10 9:45:41

数字化服务环境下高校成人教育图书馆服务工作的发展方向

1.利用高校成人教育图书馆的整体化优势进行图书馆网络的优化组织与协调&#xff0c;使数字化信息服务功能在图书馆数字化服务中得以充分实现&#xff0c;促使数字电子信息资源成为图书馆信息服务的有机组成部分。2.高校成人教育应该从宏观上有计划有组织地协调高校成人教育图书…...

编程日记 2023/3/10 9:44:34

以创作之名致敬女性开发者

作者简介&#xff1a;一名云计算网络运维人员、每天分享网络与运维的技术与干货。 座右铭&#xff1a;低头赶路&#xff0c;敬事如仪 个人主页&#xff1a;网络豆的主页​​​​​​ 前言 在昨天的2023年3月8日&#xff0c;是咱们女性朋友的节日妇女节&#xff0c;本章将会…...

编程日记 2023/3/10 9:43:31

【ArcGIS学习记录03】--利用DEM数据提取河网溪流--加入大型河流数据及裁剪美化

【ArcGIS学习记录03】–利用DEM数据提取河网溪流–加入大型河流数据及裁剪美化 注&#xff1a;本文仅作为自己的学习记录以备以后复习查阅 一 添加大型河流数据 数据是我自己找的&#xff0c;如果有需要的可以私信我发&#xff1a; 二 裁剪 使用这个相交的工具可以对矢量…...

编程日记 2023/3/10 9:42:24

VOC2012数据集取需要的几个类别

Visual Object Classes Challenge 2012 一、VOC2012二、保留 people ，移除其他类三、画一张图片3.1 新开窗口显示3.2 在jupyter notebook 里面显示一、VOC2012 这项挑战的主要目标是从许多视觉对象中识别对象 现实场景中的对象类（即不是预先分割的对象）。是的 从根本上说，…...

编程日记 2023/3/10 9:41:15

主成分分析（PCA）原理

主成分分析&#xff08;PCA&#xff09;原理 在高维数据处理中&#xff0c;为了简化计算量以及储存空间&#xff0c;需要对这些高维数据进行一定程度上的降维&#xff0c;并尽量保证数据的不失真。PCA和ICA是两种常用的降维方法。 PCA&#xff1a;principal component analysi…...

编程日记 2023/3/10 9:40:12

Git：合并一个仓库的某个分支到另一个仓库的某个分支

ps&#xff1a;&#xff08;同名分支或不同名分支均可&#xff09; 1.操作: 当前仓库A的一个指定分支1 推给 另一个仓库B的另一个指定分支2 仓库A:repo1 分支1&#xff1a;develop1 仓库B:repo2 分支2&#xff1a;develop2 2.操作命令&#xff1a; 1、git pull # 在当前仓…...

编程日记 2023/3/10 9:39:09

工作记录：bi重构

2023.3.8&#xff0c;我在组内进行工作汇报。内容记录如下&#xff1a; 本次重构的特点 改动大影响后续开发 所以有必要进行工作汇报&#xff0c;让组内同事了解代码的改动与现状。 为什么要重构代码&#xff1f; 正在开发的数据报告模块包含大量 widget 功能&#xff0c;…...

编程日记 2023/3/10 9:38:03

java明文数据加密、脱敏方法总结

前言 在一些安全性要求比较高的项目里&#xff0c;避免不了要对敏感信息进行加解密&#xff0c;比如配置文件中的敏感信息。 第一种方法&#xff08;自定义加解密&#xff09; 加解密工具类&#xff1a; public class SecurityTools {public static final String ALGORITHM…...

编程日记 2023/3/10 9:36:56

4N65-ASEMI高压MOS管4N65

编辑-Z 4N65在TO-220封装里的静态漏极源导通电阻&#xff08;RDS(ON)&#xff09;为2.5Ω&#xff0c;是一款N沟道高压MOS管。4N65的最大脉冲正向电流ISM为16A&#xff0c;零栅极电压漏极电流(IDSS)为10uA&#xff0c;其工作时耐温度范围为-55~150摄氏度。4N65功耗&#xff08…...

编程日记 2023/3/10 9:35:53

天梯赛训练L1-018 （大笨钟）

目录 1、L1-018 大笨钟 2、 如果到帮助大家&#xff0c;希望大家一键三连&#xff01;&#xff01;&#xff01; 1、L1-018 大笨钟 分数 10 题目通道 微博上有个自称“大笨钟V”的家伙&#xff0c;每天敲钟催促码农们爱惜身体早点睡觉。不过由于笨钟自己作息也不是很规律&a…...

编程日记 2023/3/10 9:34:49

GCC编译器编译C/C++程序（一步完成、分步完成）

以下内容源于C语言中文网的学习与整理&#xff0c;非原创&#xff0c;如有侵权请告知删除。 参考内容 &#xff08;1&#xff09;GCC 预处理器选项_dllbl的博客-CSDN博客 &#xff08;2&#xff09;Preprocessor Options (Using the GNU Compiler Collection (GCC)) 一、编译的…...

编程日记 2023/3/10 9:33:44

Java8中那些方便又实用的Map函数

简介 java8之后&#xff0c;常用的Map接口中添加了一些非常实用的函数&#xff0c;可以大大简化一些特定场景的代码编写&#xff0c;提升代码可读性&#xff0c;一起来看看吧。 computeIfAbsent函数 比如&#xff0c;很多时候我们需要对数据进行分组&#xff0c;变成Map<…...

编程日记 2023/3/10 9:32:40

如何修复dxgi.dll文件错误？修复方法推荐

如果您使用Windows操作系统&#xff0c;在使用某些应用程序时&#xff0c;可能会遇到dxgi.dll文件错误。这可能会导致应用程序崩溃或无法正常运行。在本文中&#xff0c;我们将探讨如何修复dxgi.dll文件错误。 一.什么是dxgi.dll文件 dxgi.dll文件是Microsoft DirectX图形接口…...

编程日记 2023/3/10 9:31:36

数字化时代，你应该知道的BI

我曾经看到有人在讨论过商业智能BI的部署对于企业是否有实际意义&#xff0c;现在市场的数据已经证明商业智能BI在商业世界中&#xff0c;在企业的实践中证明了自己的价值&#xff0c;得到了广泛的认可。 一、什么是BI 有一点可能很多人没有想到&#xff0c;实际上商业智能BI…...

编程日记 2023/3/10 9:30:32

前端jQuery ajax请求，后端node.js使用cors跨域

前言 跨域&#xff0c;一句话介绍&#xff1a; 你要请求的URL地址与当前的URL地址&#xff0c;协议不同、域名不同、端口不同时&#xff0c;就是跨域。 步入正题 前端&#xff0c;jQuery ajax请求 $.ajax({async: false,method: post,//URl和端口与后台匹配好&#xff0c;当…...

编程日记 2023/3/10 9:29:29

JavaSec-RCE

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

编程新知 2025/7/5 21:02:11

C++：std::is_convertible

C++标志库中提供is_convertible，可以测试一种类型是否可以转换为另一只类型： template <class From, class To> struct is_convertible; 使用举例： #include <iostream> #include <string>using namespace std;struct A { }; struct B : A { };int main…...

编程新知 2025/6/11 15:23:57

React Native 导航系统实战（React Navigation）

导航系统实战&#xff08;React Navigation&#xff09; React Navigation 是 React Native 应用中最常用的导航库之一&#xff0c;它提供了多种导航模式&#xff0c;如堆栈导航&#xff08;Stack Navigator&#xff09;、标签导航&#xff08;Tab Navigator&#xff09;和抽屉…...

编程新知 2025/6/21 7:48:44

React第五十七节 Router中RouterProvider使用详解及注意事项

前言 在 React Router v6.4 中&#xff0c;RouterProvider 是一个核心组件&#xff0c;用于提供基于数据路由&#xff08;data routers&#xff09;的新型路由方案。 它替代了传统的 <BrowserRouter>&#xff0c;支持更强大的数据加载和操作功能&#xff08;如 loader 和…...

编程新知 2025/7/4 13:58:19

java调用dll出现unsatisfiedLinkError以及JNA和JNI的区别

UnsatisfiedLinkError 在对接硬件设备中&#xff0c;我们会遇到使用 java 调用 dll文件 的情况&#xff0c;此时大概率出现UnsatisfiedLinkError链接错误&#xff0c;原因可能有如下几种 类名错误包名错误方法名参数错误使用 JNI 协议调用&#xff0c;结果 dll 未实现 JNI 协…...

编程新知 2025/7/4 22:49:12

06 Deep learning神经网络编程基础 激活函数 --吴恩达

深度学习激活函数详解 一、核心作用 引入非线性：使神经网络可学习复杂模式控制输出范围：如Sigmoid将输出限制在(0,1)梯度传递：影响反向传播的稳定性二、常见类型及数学表达 Sigmoid σ ( x ) = 1 1 +...

编程新知 2025/7/5 11:16:23

Linux --进程控制

本文从以下五个方面来初步认识进程控制&#xff1a; 目录 进程创建 进程终止 进程等待 进程替换 模拟实现一个微型shell 进程创建 在Linux系统中我们可以在一个进程使用系统调用fork()来创建子进程&#xff0c;创建出来的进程就是子进程&#xff0c;原来的进程为父进程。…...

编程新知 2025/7/5 22:04:57

使用 SymPy 进行向量和矩阵的高级操作

在科学计算和工程领域&#xff0c;向量和矩阵操作是解决问题的核心技能之一。Python 的 SymPy 库提供了强大的符号计算功能&#xff0c;能够高效地处理向量和矩阵的各种操作。本文将深入探讨如何使用 SymPy 进行向量和矩阵的创建、合并以及维度拓展等操作&#xff0c;并通过具体…...

编程新知 2025/7/4 13:18:00

Java 二维码

Java 二维码 **技术&#xff1a;**谷歌 ZXing 实现 首先添加依赖 <!-- 二维码依赖 --><dependency><groupId>com.google.zxing</groupId><artifactId>core</artifactId><version>3.5.1</version></dependency><de…...

编程新知 2025/6/21 12:56:10

九天毕昇深度学习平台 | 如何安装库？

pip install 库名 -i https://pypi.tuna.tsinghua.edu.cn/simple --user 举个例子&#xff1a; 报错 ModuleNotFoundError: No module named torch 那么我需要安装 torch pip install torch -i https://pypi.tuna.tsinghua.edu.cn/simple --user pip install 库名&#x…...

编程新知 2025/7/5 7:21:39