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

html标签表示！

news 2025/7/6 0:10:07

  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

Chapter03-Authentication vulnerabilities

文章目录 1. 身份验证简介1.1 What is authentication1.2 difference between authentication and authorization1.3 身份验证机制失效的原因1.4 身份验证机制失效的影响 2. 基于登录功能的漏洞2.1 密码爆破2.2 用户名枚举2.3 有缺陷的暴力破解防护2.3.1 如果用户登录尝试失败次…...

编程新知 2025/7/5 6:38:58

React 第五十五节 Router 中 useAsyncError的使用详解

前言 useAsyncError 是 React Router v6.4 引入的一个钩子&#xff0c;用于处理异步操作&#xff08;如数据加载&#xff09;中的错误。下面我将详细解释其用途并提供代码示例。 一、useAsyncError 用途 处理异步错误&#xff1a;捕获在 loader 或 action 中发生的异步错误替…...

编程新知 2025/6/18 6:31:56

云原生核心技术 (7/12): K8s 核心概念白话解读(上)：Pod 和 Deployment 究竟是什么？

大家好&#xff0c;欢迎来到《云原生核心技术》系列的第七篇&#xff01; 在上一篇&#xff0c;我们成功地使用 Minikube 或 kind 在自己的电脑上搭建起了一个迷你但功能完备的 Kubernetes 集群。现在&#xff0c;我们就像一个拥有了一块崭新数字土地的农场主&#xff0c;是时…...

编程新知 2025/7/5 18:36:22

三维GIS开发cesium智慧地铁教程（5）Cesium相机控制

一、环境搭建 <script src"../cesium1.99/Build/Cesium/Cesium.js"></script> <link rel"stylesheet" href"../cesium1.99/Build/Cesium/Widgets/widgets.css"> 关键配置点&#xff1a; 路径验证&#xff1a;确保相对路径.…...

编程新知 2025/6/21 4:17:55

ESP32读取DHT11温湿度数据

芯片&#xff1a;ESP32 环境&#xff1a;Arduino 一、安装DHT11传感器库 红框的库&#xff0c;别安装错了 二、代码 注意&#xff0c;DATA口要连接在D15上 #include "DHT.h" // 包含DHT库#define DHTPIN 15 // 定义DHT11数据引脚连接到ESP32的GPIO15 #define D…...

编程新知 2025/7/5 19:44:54

如何为服务器生成TLS证书

TLS&#xff08;Transport Layer Security&#xff09;证书是确保网络通信安全的重要手段&#xff0c;它通过加密技术保护传输的数据不被窃听和篡改。在服务器上配置TLS证书&#xff0c;可以使用户通过HTTPS协议安全地访问您的网站。本文将详细介绍如何在服务器上生成一个TLS证…...

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

ServerTrust 并非唯一

NSURLAuthenticationMethodServerTrust 只是 authenticationMethod 的冰山一角 要理解 NSURLAuthenticationMethodServerTrust, 首先要明白它只是 authenticationMethod 的选项之一, 并非唯一 1 先厘清概念 点说明authenticationMethodURLAuthenticationChallenge.protectionS…...

编程新知 2025/7/5 18:23:28

Linux-07 ubuntu 的 chrome 启动不了

文章目录 问题原因解决步骤一、卸载旧版chrome二、重新安装chorme三、启动不了&#xff0c;报错如下四、启动不了&#xff0c;解决如下 总结 问题原因 在应用中可以看到chrome&#xff0c;但是打不开(说明&#xff1a;原来的ubuntu系统出问题了&#xff0c;这个是备用的硬盘&a…...

编程新知 2025/7/5 20:33:39

力扣-35.搜索插入位置

题目描述 给定一个排序数组和一个目标值&#xff0c;在数组中找到目标值&#xff0c;并返回其索引。如果目标值不存在于数组中&#xff0c;返回它将会被按顺序插入的位置。 请必须使用时间复杂度为 O(log n) 的算法。 class Solution {public int searchInsert(int[] nums, …...

编程新知 2025/7/4 21:51:31

2025季度云服务器排行榜

在全球云服务器市场&#xff0c;各厂商的排名和地位并非一成不变&#xff0c;而是由其独特的优势、战略布局和市场适应性共同决定的。以下是根据2025年市场趋势&#xff0c;对主要云服务器厂商在排行榜中占据重要位置的原因和优势进行深度分析&#xff1a; 一、全球“三巨头”…...

编程新知 2025/7/5 17:16:12