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

【前端】HTML

news 来源：原创 2025/6/24 14:04:41

一、HTML结构
- 1.1 HTML标签
- 1.2 HTML文件基本结构
- 1.3 快速生成框架
二、HTML常见标签
- 2.1 注释标签 !-- –
- 2.2 标题标签 h1到h6
- 2.3 段落标签 p
- 2.4 换行标签 br
- 2.5 格式化标签
- 2.6 图片标签 img
- 2.7 超链接标签 a
三、表格标签
- 3.1 常用标签
- 3.2 合并单元格
四、列表标签
五、表单标签
- 5.1 表单域: form 标签
- 5.2 表单控件: input 标签
- 5.3 label 标签
- 5.4 select 标签
- 5.5 textarea 标签
六、无语义标签: div & span

一、HTML结构

1.1 HTML标签

HTML 代码是由 “标签” 构成的。

<body> hello world </body>

标签名 (body) 放到 < > 中
大部分标签成对出现. 为开始标签, 为结束标签.
少数标签只有开始标签, 称为 “单标签”.
开始标签和结束标签之间, 写的是标签的内容. (hello world)
开始标签中可能会带有 “属性”. id 属性相当于给这个标签设置了一个唯一的标识符(身份证号码).
hello

1.2 HTML文件基本结构

<html><head><title>第一个页面名字</title></head><body>hello world </body>
<html>

上述代码效果图：

代码内容简介：

html 标签是整个 html 文件的根标签(最顶层标签)
head 标签中写页面的属性.
body 标签中写的是页面上显示的内容
title 标签中写的是页面的标题.

标签关系：

head 和 body 是 html 的子标签(html 就是 head 和 body 的父标签)
title 是 head 的子标签. head 是 title 的父标签.
head 和 body 之间是兄弟关系.

1.3 快速生成框架

在 VScode中创建文件 xxx.html , 直接输入 ! , 按 tab / enter 键, 此时能自动生成代码的主体框架。

<!DOCTYPE html>
<html lang="en"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title></head><body></body>
</html>

称为 DTD (文档类型定义), 描述当前的文件是一个 HTML5 的文件.
其中 lang 属性表示当前页面是一个 “英语页面”. 这里暂时不用管. (有些浏览器会根据此处的声明提示是否进行自动翻译).
描述页面的字符编码方式. 没有这一行可能会导致中文乱码.
<meta name=“viewport” content=“width=device-width, initial-scale=1.0”>
- name=“viewport” 其中 viewport 指的是设备的屏幕上能用来显示我们的网页的那一块区域.
- content=“width=device-width, initial-scale=1.0” 在设置可视区和设备宽度等宽, 并设置初始缩放为不缩放. (这个属性对于移动端开发更重要一些).

二、HTML常见标签

2.1 注释标签 !-- –

格式如下：

<!-- 注释 -->

在编辑器中使用 Ctrl+/ 快捷键注释。

2.2 标题标签 h1到h6

数字越大，标题越小。

    <h1>标题h1</h1><h2>标题h2</h2><h3>标题h3</h3><h4>标题h4</h4><h5>标题h5</h5><h6>标题h6</h6>

代码结果：

2.3 段落标签 p

在HTML中，不会自动帮你分段，粘贴一个分了段的文本，还是会一行一行写满。
分段就需要p标签：

<p>  这是一个段落</p>
<p>这是一个段落</p>
<p>这是一个段落</p>

代码结果：

可以看见上述结果并没有缩进，并且就算我们在内容中打上空格，表示缩进也不会有效果。
HTML表示空格：

HTML提供了几种不同的空格字符实体来表示空格，每种都有不同的宽度和特性：
：这是最常用的空格字符实体，代表一个不断行的空白格。它的宽度受字体影响，通常等于一个标准字符的宽度。如果需要在网页中插入多个连续的空格，可以重复使用。
：这个字符实体表示一个半角的空格，宽度大约是一个标准字符的一半，不受字体影响。
：这个字符实体表示一个全角的空格，宽度大约是一个标准字符的宽度，也不受字体影响。
：这个字符实体表示一个比标准空格更窄的空格

p标签注意事项：

p 标签之间存在一个空隙
当前的 p 标签描述的段落, 前面还没有缩进. (未来 CSS 会学)
自动根据浏览器宽度来决定排版.
html 内容首尾处的换行, 空格均无效.
在 html 中文字之间输入的多个空格只相当于一个空格.
html 中直接输入换行不会真的换行, 而是相当于一个空格.

2.4 换行标签 br

注意事项：

br 是一个单标签(不需要结束标签)
br 标签不像 p 标签那样带有一个很大的空隙.
是规范写法. 不建议写成

这是一个
段落

这是一个段落

这是一个段落

执行结果：

2.5 格式化标签

strong 加粗标签
b 加粗标签
em 倾斜标签
i 倾斜标签
del 删除标签
s 删除线标签
ins 下划线标签
u 下划线标签

strong 加粗

b 加粗

em 倾斜

i 倾斜

~~del 删除线~~

~~s 删除线~~

ins 下划线

u 下划线

执行结果：

2.6 图片标签 img

img 标签必须带有 src 属性. 表示图片的路径。
图片路径：

可以是网络路径：网上图片的位置。
也可以是绝对路径；
还可以是相对路径。

img 标签的其他属性

alt: 替换文本. 当文本不能正确显示的时候, 会显示一个替换的文字。
title: 提示文本. 鼠标放到图片上, 就会有提示。
width/height: 控制宽度高度. 高度和宽度一般改一个就行, 另外一个会等比例缩放. 否则就会图片
失衡。
border: 边框, 参数是宽度的像素. 但是一般使用 CSS 来设定。

2.7 超链接标签 a

href: 必须具备, 表示点击后会跳转到哪个页面。
target: 打开方式. 默认是 _self. 如果是 _blank 则用新的标签页打开。

哈希

链接形式：

外部链接: href 引用其他网站的地址。

百度
内部链接: 网站内部页面之间的链接. 写相对路径即可。
空链接: 使用 # 在 href 中占位。

空链接
下载链接: href 对应的路径是一个文件。(可以使用 zip 文件)。
网页元素链接: 可以给图片等任何元素添加链接(把元素放到 a 标签中)。
锚点链接: 可以快速定位到页面中的某个位置。

三、表格标签

3.1 常用标签

table 标签: 表示整个表格
tr: 表示表格的一行
td: 表示一个单元格
th: 表示表头单元格. 会居中加粗
thead: 表格的头部区域(注意和 th 区分, 范围是比 th 要大的)
tbody: 表格得到主体区域.

表格标签有一些属性, 可以用于设置大小边框等. 但是一般使用 CSS 方式来设置.
这些属性都要放到 table 标签中。

align 是表格相对于周围元素的对齐方式. align=“center” (不是内部元素的对齐方式)
border 表示边框. 1 表示有边框(数字越大, 边框越粗), “” 表示没边框.
cellpadding: 内容距离边框的距离, 默认 1 像素
cellspacing: 单元格之间的距离. 默认为 2 像素
width / height: 设置尺寸

设计如下表格：

    <table align="center" border="1" cellpadding="20" cellspacing="0"width="500" height="500"><tr><td>姓名</td><td>性别</td><td>年龄</td></tr><tr><td>张三</td><td>男</td><td>10</td></tr><tr><td>李四</td><td>女</td><td>11</td></tr>
</table>

执行结果：

3.2 合并单元格

跨行合并: rowspan=“n”
跨列合并: colspan=“n”

步骤

先确定跨行还是跨列
找好目标单元格(跨列合并, 左侧是目标单元格; 跨行合并, 上方是目标单元格)
删除的多余的单元格

四、列表标签

主要使用来布局的，整齐好看。

无序列表[重要] ul ，li
有序列表[用的不多] ol， li
自定义列表[重要] dl (总标签) dt (小标题) dd (围绕标题来说明) 上面有个小标题, 面有几个围绕着标题来展开的。

例子：

<h3>无序列表</h3>
<ul><li>无序</li><li>无序</li><li>无序</li>
</ul>
<h3>有序列表</h3>
<ol><li>有序</li><li>有序</li><li>有序</li>
</ol>
<h3>自定义列表</h3>
<dl><dt>自定义</dt><dd>自定义</dd><dd>自定义</dd><dd>自定义</dd>
</dl>

结果：

五、表单标签

表单分成两个部分:

表单域: 包含表单元素的区域. 重点是 form 标签。
表单控件: 输入框, 提交按钮等. 重点是 input 标签。

5.1 表单域: form 标签

<form action="test.html">... [form 的内容]
</form>

5.2 表单控件: input 标签

各种控件：

type(必须有), 取值种类很多多, button, checkbox, text, file, image, password，radio 等.
name: 给 input 起了个名字. 尤其是对于单选按钮, 具有相同的 name 才能多选一.
value: input 中的默认值.
checked: 默认被选中. (用于单选按钮和多选按钮)
maxlength: 设定最大长度.

文本框<input type="text">
密码框<input type="password">
单选框：单选框之间必须具备相同的 name 属性, 才能实现多选一效果. <input type="radio" name="sex">
复选框<input type="checkbox">
普通按钮<input type="button" value="我是个按钮">
提交按钮：提交按钮必须放到 form 标签内. 点击后就会尝试给服务器发送。
清空按钮：清空按钮必须放在 form 中. 点击后会将 form 内所有的用户输入内容重置。

5.3 label 标签

搭配 input 使用. 点击 label 也能选中对应的单选/复选框, 能够提升用户体验。
for 属性: 指定当前 label 和哪个相同 id 的 input 标签对应. (此时点击才是有用的)。

<label for="male">男</label> <input id="male" type="radio" name="sex">

5.4 select 标签

下拉菜单：
option 中定义 selected=“selected” 表示默认选中。

<select><option>北京</option><option selected="selected">上海</option>
</select>

5.5 textarea 标签

文本域中的内容, 就是默认内容, 注意, 空格也会有影响.
rows和cols也都不会直接使用,都是用css来改的。

<textarea rows="3" cols="50"></textarea>

示例：

<form action="HTML.html">账户：<input type="text"></form><br><!--文本框 -->密码：<input type="password"><br><!--密码框-->性别：<input type="radio" name="sex" id="male1" > <label for="male1">男</label><input type="radio" name="sex" id="male2" ><label for="male2">女</label><br><!--单选框-->兴趣：<input type="checkbox" name="intrest" id = "i1"><label for="i1">唱</label><input type="checkbox" name="intrest" id = "i2"><label for="i2">跳</label><input type="checkbox" name="intrest" id = "i3"><label for="i3">rap</label><input type="checkbox" name="intrest" id = "i4"><label for="i4">篮球</label><br><!--多选框--><input type="submit" value="提交"></form>

结果：

六、无语义标签: div & span

div标签，division的缩写，含义是分割。
span标签，含义是跨度。

就是相当于两个盒子。用于网页布局：

div是独占一行的，是一个大盒子.
span不独占一行，是一个小盒子

【前端】HTML

目录一、HTML结构 1.1 HTML标签1.2 HTML文件基本结构1.3 快速生成框架二、HTML常见标签 2.1 注释标签 !-- –2.2 标题标签 h1到h62.3 段落标签 p2.4 换行标签 br2.5 格式化标签2.6 图片标签 img2.7 超链接标签 a 三、表格标签 3.1 常用标签3.2 合并单元格四、列表标签五、表…...

编程日记 2025/6/24 14:04:41

LabVIEW实现GPS通信

目录 1、GPS通信原理 2、硬件环境部署 3、程序架构 4、前面板设计 5、程序框图设计 6、测试验证本专栏以LabVIEW为开发平台，讲解物联网通信组网原理与开发方法，覆盖RS232、TCP、MQTT、蓝牙、Wi-Fi、NB-IoT等协议。结合实际案例，展示如何利用LabVIEW和常用模块实现物联网系…...

编程日记 2025/6/24 13:35:25

【Python 小课堂】第 2 课 Python 基础知识：语句、常量、变量和注释

第 2 课基础知识：语句、常量/变量和注释 By Yichen Li 2024/12/14 一、内容简介在本次课中，介绍Python语句、常量/变量以及代码注释的基本概念，一些详细的概念、扩展及用法等细节，留至后续介绍。二、Python语句一般来说&…...

编程日记 2025/6/21 10:27:49

基于STM32设计的工地扬尘与噪音实时监测系统(网页)

一、前言当前项目使用的相关软件工具、传感器源代码工程已经上传到网盘（实时更新项目内容）：https://ccnr8sukk85n.feishu.cn/wiki/QjY8weDYHibqRYkFP2qcA9aGnvb?fromfrom_copylink 1.1 项目开发背景近年来，随着城市化进程的…...

编程日记 2025/6/2 7:00:44

LLM之RAG实战（五十）| FastAPI：构建基于LLM的WEB接口界面

FastAPI是WEB UI接口，随着LLM的蓬勃发展，FastAPI的生态也迎来了新的机遇。本文将围绕FastAPI、OpenAI的API以及FastCRUD，来创建一个个性化的电子邮件写作助手，以展示如何结合这些技术来构建强大的应用程序。下面我们开始分步骤操…...

编程日记 2025/6/20 10:24:24

JavaScript 中的 Map方法

JavaScript 中的 Map方法在 JavaScript 中，Map 是一种用于存储键值对的数据结构，相较于传统的对象（Object），Map 提供了更高效的键值对操作方式适合处理需要频繁操作键值对的场景。 1. 创建 Map const map new Map…...

编程日记 2025/6/19 20:23:29

img引入svg如何修改颜色

方法1：通过css中filter:drop-shadow 首先需要一个容纳图标的父盒子(下方实例中的.svg-img)，通过css造一个图标的‘影子’（.svg-color中的drop-shadow），然后设置‘影子’的颜色，再把图标本体移出父盒子&…...

编程日记 2025/6/20 5:15:23

自然语言处理基础及应用场景

自然语言处理定义让计算机理解人所说的文本语音 Imitation Game 图灵测试行为主义鸭子理论自然语言处理的基本任务词性标注：区分每个词名词、动词、形容词等词性命名实体的识别：名词的具体指代是哪一类事物共指消解：代词指代的是前面…...

编程日记 2025/6/20 15:49:34

构建centos docker基础镜像

1、介绍比较老的版本docker镜像，不太好找，可以尝试自己构建各版本构建基础镜像方法不太一样，方式也不同，自己尝试，本文只介绍了我自己的尝试 2、构建centos5.11 docker镜像准备iso文件 （1）安…...

编程日记 2025/6/21 10:37:01

etcd命令大全

默认安装自带etcdctl 命令行客户端，分两个版本ETCDCTL_API2和ETCDCTL_API3，两个版本不一样，操作的数据也不相容。本文以v3 为例。使用之前需要先设置：export ETCDCTL_API3。 1 etcd查询集群节点列表及状态标准输出&#xff1…...

编程日记 2025/6/23 19:34:26

Go有限状态机实现和实战

Go有限状态机实现和实战有限状态机什么是状态机有限状态机（Finite State Machine, FSM）是一种用于建模系统行为的计算模型，它包含有限数量的状态，并通过事件或条件实现状态之间的转换。FSM的状态数量是有限的，因此称…...

编程日记 2025/6/23 6:03:04

使用torch模型BMM int8计算。模拟：BMM->softmax->BMM 计算流程 import torch import numpy as np torch.manual_seed(777) def int8_quantize_per_token(x: torch.Tensor, axis: int -1, attnsFalse):if x.dtype ! torch.float32:x x.type(torch.float32)…...

编程日记 2025/5/30 22:45:21

vue3的watch一次性监听多个值用法

vue3的watch一次性监听多个值 1、监听单个值 watch(() > route.params.keyword, (newValue, oldValue) > {console.log(监听值变化, newVal, oldVal)state.a newValue});2、监听多个值 watch(() > [route.params.id, route.params.keyword], (newValue, oldValue) &g…...

编程日记 2025/6/20 18:03:41

【one-api和ollama结合使用】

将Ollama接入one-api one-api是一个开源AI中间件服务，可以聚合各家大模型API，比如OpenAI、ChatGLM、文心一言等，聚合后提供统一的OpenAI调用方法。举个例子：ChatGLM和文心一言的API调用方法并不相同，one-api可以对其进…...

编程日记 2025/6/21 21:07:45

Oracle PDB的开启和关闭

[生产环境关闭与开启Oracle PDB] 【运维场景】在运维Oracle PDB的时候经常要开启和关闭PDB，对关闭和开启PDB的操作要非常熟悉。【操作方法】 1. PDB的打开与关闭关闭和开启DB的时候要看DB的警告日志，日志位置（在Oracle用户下查看&…...

编程日记 2025/5/30 6:46:11

十一、动态构建UI元素

装饰器Builder 装饰器BuilderParam <font style"color:rgba(0, 0, 0, 0.9);">BuilderParam</font> 该装饰器用于声明任意UI描述的一个元素，类似slot占位符。链接简而言之：就是自定义组件允许外部传递 UI // SonCom 的实现略…...

编程日记 2025/6/3 12:34:52

智能时代的基石：神经网络

智能时代的基石：神经网络第一节：神经网络简介课程目标本节课程旨在全面介绍神经网络的基本概念、结构以及其在历史发展中的重要里程碑。通过深入理解神经网络的工作原理和演变过程，学员将能够掌握神经网络在现实世界中的多种应用&#…...

编程日记 2025/6/23 8:54:55

VScode配置GIT

在Visual Studio Code（VSCode）中检测不到已安装的Git可以通过以下步骤来解决‌： ‌确认Git是否正确安装‌：首先，确保在计算机上正确安装了Git。可以通过打开命令行窗口并输入git --version来检查是否能够显示Git的版本…...

编程日记 2025/6/19 23:10:36

【CSS】css 如何实现固定宽高比

今天和同事讨论这个问题，一时间还想不到了，于是学习了下，就顺便当个记录吧要在CSS中实现固定宽高比，有两种主要的方法可以选择。一种是使用新的aspect-ratio属性，另一种是利用padding技巧。随着现代浏览器对aspect-ra…...

编程日记 2025/6/20 20:41:04

使用webrtc-streamer查看实时监控

摄像头配置（海康摄像头为例） 摄像头视频编码应改成H264格式 webrtc-streamer下载 webrtc-streamer下载地址下载后解压出来双击运行，端口默认8000 VUE2项目引入文件在项目静态文件“public”中需引入两个js文件“webrtcstreamer.js”与“…...

编程日记 2025/6/4 0:16:52

ansible部署nginx：1个简单的playbook脚本

文章目录 hosts--ventoryroles执行命令使用ansible向3台centos7服务器上安装nginx hosts–ventory [rootstand playhook1]# cat /root/HOSTS # /root/HOSTS [webservers] 192.168.196.111 ansible_ssh_passpassword 192.168.196.112 ansible_ssh_passpassword 192.168.196.1…...

编程日记 2025/5/30 16:57:05

Ubuntu安装Gitlab详细图文教程

1、环境准备 1.1、Ubuntu环境 Ubuntu24.04Sever版安装教程 1.2、更新系统 sudo apt update -y sudo apt-get update sudo apt-get upgrade 2、安装Nginx 2.1 安装nginx # 安装 apt install nginx -y 2.2 修改nginx配置⽂件 # 修改nginx配置 vim /etc/nginx/si…...

编程日记 2025/6/19 21:06:56

前端面试准备问题2

1.防抖和节流分别是什么，应用场景防抖：在事件被触发后，只有在指定的延迟时间内没有再次触发，才执行事件处理函数。在我的理解中，简单的说就是在一个指定的时间内，仅触发一次，如果有多次重复触…...

编程日记 2025/6/23 14:22:33

uni-app之web-view组件 postMessage 通信【跨端开发系列】

🔗 uniapp 跨端开发系列文章：🎀🎀🎀 uni-app 组成和跨端原理【跨端开发系列】 uni-app 各端差异注意事项【跨端开发系列】uni-app 离线本地存储方案【跨端开发系列】uni-app UI库、框架、组件选型指南【跨端开…...

编程日记 2025/6/24 10:55:07

IntelliJ IDEA 使用技巧与插件推荐

目录常用使用技巧 1. 使用快捷键提升开发效率 2. 多光标编辑 3. 代码自动补全 4. 使用 Find Action 快速执行操作 5. 集成版本控制系统（VCS） 6. 快速查看代码文档推荐插件 1. Lombok Plugin 2. Rainbow Brackets 3. Key Promoter X 4. Chec…...

编程日记 2025/6/4 15:39:42

zookeeper基础命令详解

zookeeper基础命令详解目录文章目录 zookeeper基础命令详解目录一、列出所有基础命令一、列出所有基础命令先启动一个zookeeper客户端连接zookeeper，如果还没有启动zookeeper集群的参考本文启动之后再做后续操作。 https://blog.csdn.net/weixin_42924400/artic…...

编程日记 2025/6/19 23:12:39

2025周易算命网站搭建详细方法+源码选择php环境的配置

以下是一个详细的搭建教程，包括网站分类、环境配置、程序设计和功能实现。 1. 环境准备 1.1 服务器选择操作系统: Linux（推荐使用Ubuntu或CentOS）Web服务器: Nginx数据库: MySQLPHP版本: 7.4.x（确保小于8.0） 1.2 安…...

编程日记 2025/6/21 1:41:03

16：00面试，16：06就出来了，问的问题有点变态。。。

从小厂出来，没想到在另一家公司又寄了。到这家公司开始上班，加班是每天必不可少的，看在钱给的比较多的份上，就不太计较了。没想到5月一纸通知，所有人不准加班，加班费不仅没有了，薪资还要降40%…...

编程日记 2025/6/22 1:35:04

《杨辉三角》

题目描述给出 n(1≤n≤20)n(1≤n≤20)，输出杨辉三角的前 nn 行。如果你不知道什么是杨辉三角，可以观察样例找找规律。输入格式无输出格式无输入输出样例输入 #1复制 6 输出 #1复制 1 1 1 1 2 1 1 3 3 1 1 4 6 4 1 1 5 10 10 5 1 C语言…...

编程日记 2025/5/31 0:37:45

2024年03月中国电子学会青少年软件编程（Python）等级考试试卷（五级）答案 + 解析

青少年软件编程（Python）等级考试试卷（五级）分数：100 题数：38 一、单选题(共25题，共50分) 1. 以下代码的输出结果是？（） nums = list(range(100, 201)) print...

编程日记 2025/5/27 0:33:12

【游戏设计原理】7 - 加德纳的多元智能理论

虽然多元智能理论是对认知方式的分类，但它也可以为游戏设计提供丰富的思路和策略，帮助设计师创建更具吸引力、包容性和多样性的游戏。通过理解不同玩家的认知方式和优势，我们可以更精准地设计游戏的元素和玩法，使其能够吸引广泛的…...

编程日记 2025/6/22 1:40:17

Jackson @JsonProperty 注解

1. 概述 Jackson 是一个流行的Java库，用于将Java对象转换为JSON格式以及从JSON反序列化回Java对象。一种常见的需求是在序列化为JSON或从JSON反序列化时自定义字段的命名。Jackson 的 JsonProperty 注解正好满足了这一需求。 JsonProperty 注解概览 JsonProperty…...

编程日记 2025/6/1 10:22:31

【数据结构——栈与队列】链栈的基本运算（头歌实践教学平台习题）【合集】

目录😋 任务描述相关知识测试说明我的通关代码: 测试结果： 任务描述本关任务：编写一个程序实现链栈的基本运算。相关知识为了完成本关任务，你需要掌握： 初始化栈、销毁栈、判断栈是否为空、进栈、出栈、取栈…...

编程日记 2025/6/4 4:01:22

数据库乐观锁和悲观锁、redis分布式锁使用场景

前言最近发现我们同事，但凡需要加锁的地方都用的是分布式锁。而且我们的后台系统，并没有什么并发量，而且还是单体应用。我真的有点怀疑我的同事不太清楚数据乐观锁、悲观锁和redis分布式的使用场景。请今天就说一下各种锁的应用场景吧。 …...

编程日记 2025/6/23 8:27:58

React的状态管理库-Redux

核心思想：单一数据源、状态是只读的、以及使用纯函数更新状态。组成部分 Store（存储） 应用的唯一状态容器，存储整个应用的状态树,使用 createStore() 创建。 getState()：获取当前状态。dispatch(action)&#xff…...

编程日记 2025/6/24 8:22:55

《自制编译器》--青木峰郎 -读书笔记编译hello

在该书刚开始编译hello.cb时就遇到了问题。本人用的是wsl，环境如下， 由于是64位，因此根据书中的提示，从git上下载了64位的cb编译器 cbc-64bit 问题一: 通过如下命令编译时,总是报错。 cbc -Wa,"--32" -Wl,"-…...

编程日记 2025/6/21 15:38:49

XSS（跨站攻击）

XSS漏洞（跨站脚本） 1.XSS 漏洞简介 XSS又叫CSS（Cross Site Script）跨站脚本攻击是指恶意攻击者往Web页面里插入恶意Script代码，当用户浏览该页之时，嵌入其中Web里面的Script代码会被执行，从…...

编程日记 2025/6/21 1:41:01

华为自反ACL实验

一、实验背景做这个实验的原因是最近公司里上了三台小程序服务器，由于三台服务器的端口都映射出去了，领导要求A网段的三台服务器不能访问内网B，C网段，同时B、C网段内网用户可以访问A段的94、95、96服务器； 也就是PC4\…...

编程日记 2025/6/3 4:02:26

MyBatisPlus实现多表查询

在MyBatisPlus中实现多表查询，主要有以下几种方法： 使用注解进行多表查询： 你可以在Mapper接口中使用Select注解来编写SQL查询语句，实现多表查询。例如，如果你想根据用户ID查询用户信息和对应的区域名称，可…...

编程日记 2025/6/19 20:20:16

【人工智能-中级】循环神经网络（RNN）与Transformer在自然语言处理中的进阶应用

循环神经网络（RNN）与Transformer在自然语言处理中的进阶应用自然语言处理（NLP）是人工智能领域中的重要分支，其主要任务是使计算机能够理解、生成和处理人类语言。近年来，循环神经网络（RNN）和Transformer模型已成为NLP领域的两大核心技术。本文将探讨这两类模型在自然…...

编程日记 2025/6/24 5:45:39

ZED相机应用

下载SDK wget https://stereolabs.sfo2.cdn.digitaloceanspaces.com/zedsdk/3.6/ZED_SDK_Ubuntu18_cuda11.5_v3.6.5.run 安装 ./ZED_SDK_Ubuntu18_cuda11.5_v3.6.5.run skip_python 测试 cd /usr/local/zed/tools ls ZED_Calibration ZED_Depth_Viewer ZED_Diagnostic ZED_E…...

编程日记 2025/5/30 18:38:18

目录

一、HTML结构

1.1 HTML标签

1.2 HTML文件基本结构

1.3 快速生成框架

二、HTML常见标签

2.1 注释标签 !-- –

2.2 标题标签 h1到h6

2.3 段落标签 p

2.4 换行标签 br

2.5 格式化标签

2.6 图片标签 img

2.7 超链接标签 a

三、表格标签

3.1 常用标签

3.2 合并单元格

四、列表标签

五、表单标签

5.1 表单域: form 标签

5.2 表单控件: input 标签

5.3 label 标签

5.4 select 标签

5.5 textarea 标签

六、无语义标签: div & span

相关文章：