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

HTML 学习记录

article 2026/4/24 21:21:18

HTML 学习记录

html是超文本标记语言，是一种标记语言

超文本：链接

标记：也叫标签，带尖括号的文本

标签语法

1.标签成对出现，中间包裹内容

2.<>里面放英文字母

3.结束标签比开始标签多一个 /

例如

<strong> 你好 </strong>

拓展：

双标签：成对出现

单标签：只有开始标签，没有结束标签

<br> 
<hr>

基本骨架

<html>
<head><title>网页标题 </title>
</head>
<body>网页主体
</body>
</html>

HTML 部分

html是超文本标记语言，是一种标记语言

超文本：链接

标记：也叫标签，带尖括号的文本

标签语法

1.标签成对出现，中间包裹内容

2.<>里面放英文字母

3.结束标签比开始标签多一个 /

例如

<strong> 你好 </strong>

拓展：

双标签：成对出现

单标签：只有开始标签，没有结束标签

<br> 
<hr>

基本骨架

<html>
<head><title>网页标题 </title>
</head>
<body>网页主体
</body>
</html>

在这里插入图片描述

标签关系

在这里插入图片描述

各种标签

1.标题标签 h1-h6

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

2.段落标签

<p> </p>

3.单标签

<hr>  //水平线
<br> //换行

4.文本格式化标签

 <strong>你好</strong> //加粗 b(另一种方式)<em>strong</em>   //倾斜 i<ins>strong</ins> //下划线 u<del>strong</del> //删除线 s

5.图像 img

 <img src="" alt="加载失败" title="这是一张图片">
//src 是路径
//alt 是如果图片加载不出来会有什么提示
//title 提示文本，鼠标悬停的时候就会进行显示

注意:浏览器缩放图片是等比例进行缩放的

属性：属性名 = ” 属性值“

写在尖括号里面，标签的后面属性之间用空格隔开，不区分先后顺序

6.超链接

 <a href="https://www.w3school.com.cn/" target = "_blank">w3</a>
href 是跳转地址，是超链接的必须属性
target 是属性
_blank 在新窗口打开页面

7.音频

 <audio src="屏幕录制 2025-01-23 213903.mp4" controls loop autoplay></audio>
controls 显示控制面板
loop 循环播放
autoplay 自动播放

8.视频

<video src="屏幕录制 2025-01-23 213903.mp4" controls loop autoplay muted></video>
controls 显示控制面板
loop 循环播放
autoplay 自动播放
muted 静音播放
浏览器支持在静音状态下进行自动播放

9.列表

注意：ul ，ol 标签里面只能有 li标签，dl标签里面只能有dt和dd

li dt dd标签里面可以包裹任何内容

//无序列表，有序列表，定义列表
<!--  无序列表  --><ul><li>1</li><li>2</li><li>3</li></ul><!-- 有序列表 --><ol><li>yes</li><li>yes</li><li>yes</li></ol><!-- 定义列表 --><dl><dt>服务中心</dt><dd>申请售后</dd><dd>售后政策</dd><dd>订单查询</dd></dl>

10.表格

table 是表格

tr 代表行

th 代表表头单元格

td 代表内容单元格

thead 表格头部

tbody 表格内容

tfoot 表格底部

 <table border="1"><tr><th>姓名</th><th>语文</th><th>数学</th><th>总分</th></tr><tr><td>张三</td><td>99</td><td>100</td><td>199</td></tr><tr><td>lisi</td><td>98</td><td>100</td><td>198</td></tr></table>

合并单元格

1.跨行合并 2.跨列合并

步骤：保留最左最上的单元格，添加属性（取值为数字）

跨行合并 rowspan 跨列合并 colspan

最后删除其他单元格

//跨行合并<table border="1"><tr><th>姓名</th><th>语文</th><th>数学</th><th>总分</th></tr><tr><td>张三</td><td>99</td><td rowspan="2">100</td><td>199</td></tr><tr><td>lisi</td><td>98</td><td>198</td></tr></table>
//跨列合并
<table border="1"><tr><th>姓名</th><th>语文</th><th>数学</th><th>总分</th></tr><tr><td>张三</td><td>99</td><td rowspan="2">100</td><td>199</td></tr><tr><td>lisi</td><td>98</td><td>198</td></tr><tr><td>总结</td><td colspan="3">全市第一</td></tr></table>

11.表单

input

 <input type="text" placeholder="请输入电话"> //文本框<input type="password" placeholder="请输入电话"> //密码框<input type="radio">  //单选框<input type="checkbox"> //多选框<input type="file">  //上传文件
placeholder 是提示文本

radio 常用属性

 <input type="radio" name="gender">男<input type="radio" name="gender" checked>女
//name属性 控制多个变量，只选择其中一个
//checked属性 进入页面即选中

file 属性

 <input type="file" multiple> 
//multiple 属性支持上传多个文本

多选框属性

//checked属性 默认选中<input type="checkbox" checked>

下拉菜单

请选择一个数字<select name="" id=""><option value="">1</option><option value="">2</option><option value="" selected>3</option><option value="">4</option></select>
//有几个选项就有几个option，selected是默认选中

文本域

多行输入文本的表单控件

<textarea>请输入评论</textarea>

右下角有拖拽功能，未来会禁用

label标签

作用：绑定文字和表单控件的关系，增大表单控件的点击范围

//写法一
<input type="radio"  id="man"><label for="man">男</label>
//id属性和label的for属性相同，label只包裹内容，不包裹表单控件
//写法二
<label><input type="radio">女</label>

button

<button type="submit">确定</button>  //默认属性
<button type="reset"></button>  //重置，配合form标签进行使用
<button type="button"></button> //普通按钮，配合js使用

form：表单区域，进行统一管理

其中action属性，是发送数据的地址

12.布局标签 div span

作用：布局网页

div 独占一行

span 不换行

<div>hello world</div>
<span>hello</span>

字符实体

如果代码中敲键盘空格，网页只识别一个

 <p>乾坤未定，你&lt;我皆&gt;是黑&nbsp;马</p>
&lt; 小于号
&gt; 大于号
&nbsp; 空格

路径

1.相对路径从当前文件位置出发寻找目标文件

/ 表示进入某个文件夹里面

. 表示当前文件所在文件夹

… 表示进入上一级文件夹

2.绝对路径从盘符出发查找目标文件

HTML 学习记录

HTML 学习记录 html是超文本标记语言，是一种标记语言超文本：链接标记：也叫标签，带尖括号的文本标签语法 1.标签成对出现，中间包裹内容 2.<>里面放英文字母 3.结束标签比开始标签多一个 / 例如 <s…...

编程日记 2026/4/13 10:28:08

Mac之JDK安装

Mac之JDK安装一.安装 jdk 打开终端输入命令:java -version 查看是否已安装 JDK Oracle 官方下载地址根据自己Mac 系统安装查看 Mac 系统，打开中断命令，输入: uname -a Compressed Archive 是压缩文档，下载的是一个 .tar.gz 压缩包 D…...

编程日记 2026/4/21 9:47:17

离线安装dnf可用kimi搜索, centos 使用curl 下载dnf 的rpm包 mkdir ~/dnf_packages cd ~/dnf_packages# CentOS 7 示例 curl -O http://springdale.math.ias.edu/data/puias/unsupported/7/x86_64/dnf-0.6.4-2.sdl7.noarch.rpm curl -O http://springdale.math.ias.edu/data/pu…...

编程日记 2026/4/15 23:05:29

【cocos creator】拖拽排序列表

DEMO下载 GameCtrl.ts import ItemCtrl from "./ItemCtrl";const { ccclass, property } cc._decorator;ccclass export default class GameCtrl extends cc.Component {property(cc.Node)content: cc.Node null;property(cc.Node)prefab: cc.Node null;arr []…...

编程日记 2026/4/11 21:01:37

设备智能化无线通信，ESP32-C2物联网方案，小尺寸芯片实现大功能

在科技飞速发展的当下，我们的生活正被各类智能设备悄然改变，它们如同一位位无声的助手，渗透到我们生活的每一个角落，让生活变得更加便捷和丰富多彩。智能插座、智能照明和简单家电设备在家居领域的应用，为我们的生活…...

编程日记 2026/4/11 21:07:57

C# Task 学习记录

在 C# 中，Task是用于表示异步操作的核心类型之一，提供了一种简单、高效的方式来处理异步操作，使得开发者可以轻松地编写非阻塞的代码。下面是C# Task例子，包含取消、超时、延续任务、获取任务执行情况： using System;…...

编程日记 2026/4/20 4:00:48

HTML 链接

HTML 链接引言 HTML（超文本标记语言）是构建网页的基础，而链接是网页中不可或缺的元素。链接不仅能够连接到其他网页，还能实现网页内部内容的跳转。本文将详细介绍HTML链接的用法、属性以及如何实现链接的优化。 HTML链接的基本…...

编程日记 2026/3/30 7:03:26

Unity 增量打包AssetBundle

背景打包太慢了，想要没改动的资源不重新打包浪费时间。来源官方文章：https://forum.unity.com/threads/about-incremental-build-and-asset-bundle-hashes.1436032/ 官网AB介绍：https://learn.unity.com/tutorial/assets-resources-and…...

编程日记 2026/4/22 2:26:40

MYSQL实现原理 - 事务的隔离级别

版本版本日期说明v12025-02-10 准备为后续故事的顺利展开，这里创建一个账户表 create database test;CREATE TABLE test.account (user_id int(10) unsigned NOT NULL AUTO_INCREMENT COMMENT 用户ID,user_name varchar(200) NOT NULL DEFAULT COMMENT 用户名…...

编程日记 2026/4/12 21:20:39

如何在Kickstart自动化安装完成后ISO内拷贝文件到新系统或者执行命令

如何在Kickstart自动化安装完成后ISO内拷贝文件到新系统或者执行命令需求在自动化安装操作系统完成后，需要对操作系统进行配置需要拷贝一些文件到新的操作系统中需要运行一些脚本问题分析 Linux安装操作系统时，实际上是将ISO镜像文件中的操作系统…...

编程日记 2026/4/24 18:39:50

PHP 调用 SiliconFlow 语音生成 API 的脚本，用于将文本转换为 MP3 格式的语音文件

脚本概述 PHP 调用 SiliconFlow 语音生成 API 的脚本，用于将文本转换为 MP3 格式的语音文件。代码结构依赖引入 require_once vendor/autoload.php; use OpenAI\Client;使用 Composer 的自动加载机制引入 OpenAI PHP 客户端库文件路径处理 $speechFilePath…...

编程日记 2026/2/22 4:36:27

具身智能训练新思路！将生成视频用于训练机器人

将生成视频用于训练具身智能（Embodied AI）确实是近年来备受关注的前沿方向，这一思路通过结合生成式AI（如扩散模型、神经辐射场等）与机器人学习，为解决真实世界数据稀缺、训练成本高等问题提供了新可能。以下从技术逻辑、潜在优势、挑战及案例方向展开分析：一、技术逻辑…...

编程日记 2026/4/14 3:05:02

MindStudio制作MindSpore TBE算子（四）算子测试（ST测试-Ascend910B/ModelArts）--失败尝试

上一节，MindStudio制作MindSpore TBE算子（三）算子测试（ST测试），因此缺乏对应的硬件环境导致无法进行ST测试，导致难以自安，今天搞来Ascend910B服务器来填坑，看看是否是硬件…...

编程日记 2026/4/19 15:35:03

transformer 基础知识

概要：简要记录 Encoder-Decoder 架构、seq2seq 模型、Attention 机制 Encoder & Decoder encoder 接收输入，生成一个固定长度的上下文向量（编码器生成的最终隐藏状态）；decoder 接收上下文向量（或状态…...

编程日记 2026/4/20 4:39:52

基于 STM32 的病房监控系统

标题:基于 STM32 的病房监控系统内容:1.摘要基于 STM32 的病房监控系统摘要：本系统采用 STM32 微控制器作为核心，通过传感器实时监测病房内的环境参数，如温度、湿度、光照等，并将数据上传至云端服务器。医护人员可以通过手机或…...

编程日记 2026/2/17 13:32:00

DeepSeek底层揭秘——知识图谱与语料库的联邦学习架构

目录 1. 知识图谱与语料库的联邦学习架构 2. 技术要素 3. 技术难点与挑战 4. 技术路径 5. 应用场景 6. 最新研究与技术进展 7. 未来趋势 8. 实际案例猫哥说 1. 知识图谱与语料库的联邦学习架构 (1) 定义 “知识图谱与语料库的联邦学习架构”是一种结合知识图谱&…...

编程日记 2025/11/27 4:17:15

C++--iomanip库

目录 1. 设置字段宽度：std::setw() 2. 设置浮点数精度：std::setprecision() 3. 设置填充字符：std::setfill() 4. 控制对齐方式：std::left 和 std::right，std::internal 5. 控制进制输出：std::hex、std…...

编程日记 2026/2/18 13:30:33

机器学习（李宏毅）——self-Attention

一、前言本文章作为学习2023年《李宏毅机器学习课程》的笔记，感谢台湾大学李宏毅教授的课程，respect！！！ 二、大纲何为self-Attention？原理剖析self-Attention VS CNN、RNN、GNN 三、何为self-Attenti…...

编程日记 2026/4/22 9:49:10

Android和DLT日志系统

1 Linux Android日志系统 1.1 内核logger机制 drivers/staging/android/logger.c static size_t logger_offset( struct logger_log *log, size_t n) { return n & (log->size - 1); } 写的off存在logger_log中（即内核内存buffer）&am…...

编程日记 2025/11/25 1:36:27

实现限制同一个账号最多只能在3个客户端(有电脑、手机等）登录(附关键源码)

如上图，我的百度网盘已登录设备列表，有一个手机，2个windows客户端。手机设备有型号、最后登录时间、IP等。windows客户端信息有最后登录时间、操作系统类型、IP地址等。这些具体是如何实现的？下面分别给出android APP中采集手机信…...

编程日记 2026/4/22 6:29:14

DeepAR：一种用于时间序列预测的深度学习模型

介绍 DeepAR是一种基于递归神经网络（RNN）的时间序列预测模型，由亚马逊在2017年提出。它特别适用于处理多变量时间序列数据，并能够生成概率预测。DeepAR通过联合训练多个相关时间序列来提高预测性能，从而在实际应用中表…...

编程日记 2026/4/1 20:52:38

伺服报警的含义

前言： 大家好，我是上位机马工，硕士毕业4年年入40万，目前在一家自动化公司担任软件经理，从事C#上位机软件开发8年以上！我们在开发C#的运动控制程序的时候，一个必要的步骤就是设置伺服报警信号的…...

编程日记 2026/4/11 20:55:13

Linux | 文件描述符

文章目录 Linux | 文件描述符1. 文件描述符概述2. 与文件描述符关联的数据结构2.1 进程级的文件描述符表（struct files_struct）2.2 文件描述符表项（struct fdtable）2.3 文件对象（struct file）2.4 索引节点&…...

编程日记 2026/4/7 18:27:47

蓝桥杯-洛谷刷题-day5（C++）（为未完成）

1.P1328 [NOIP2014 提高组] 生活大爆炸版石头剪刀布 i.题目 ii.代码 #include <iostream> #include <string> using namespace std;int N, Na, Nb; //0-"剪刀", 1-"石头", 2-"布", 3-"蜥", 4-"斯"&#xff1…...

编程日记 2026/4/11 21:09:09

LVS 负载均衡集群（NAT模式）

一、环境准备四台主机（一台 LVS、两台 RS、一台客户端） 1.1.LVS 主机 LVS 主机（两块网卡） 第一块：NAT模式（内网） 第二块：添加网卡（仅主机模式）&#xff0…...

编程日记 2026/4/13 20:46:44

开源的轻量级分布式文件系统FastDFS

FastDFS 是一个开源的轻量级分布式文件系统，专为高性能的分布式文件存储设计，主要用于解决海量文件的存储、同步和访问问题。它特别适合以中小文件（如图片、视频等）为载体的在线服务，例如相册网站、视频网站等。 FastD…...

编程日记 2026/4/3 8:40:40

解决 DeepSeek 官网服务器繁忙的实用方案

解决 DeepSeek 官网服务器繁忙的实用方案大家在使用 DeepSeek 时，是不是经常遇到官网服务器繁忙，等半天都加载不出来的情况？别担心，今天就给大家分享一个用 DeepSeek 硅基流动 Cherry Studio 解决这个问题的实用方案&#xff…...

编程日记 2026/4/13 22:49:27

Terraform 最佳实践：Top 10 常见 DevOps/SRE 面试问题及答案

1. 如何高效管理 Terraform 状态？ 使用远程后端，如 S3 或 GCS，存储 Terraform 状态文件。这可以支持协作并确保团队工作时状态的一致性。使用 DynamoDB 或 GCS 锁定状态以防止同时修改状态。示例： backend "s3" {bu…...

编程日记 2026/4/23 18:04:32

嵌入式八股文面试题（二）C语言算法

相关概念请查看文章：C语言概念。 1. 如何实现一个简单的内存池？ 简单实现： #include <stdio.h> #include <stdlib.h>//内存块 typedef struct MemoryBlock {void *data; // 内存块起始地址struct MemoryBlock *next; // 下一个内…...

编程日记 2026/4/11 19:08:31

#渗透测试#批量漏洞挖掘#LiveBos UploadFile 任意文件上传漏洞

免责声明本教程仅为合法的教学目的而准备，严禁用于任何形式的违法犯罪活动及其他商业行为，在使用本教程前，您应确保该行为符合当地的法律法规，继续阅读即表示您需自行承担所有操作的后果，如有异议，请立即停止本文章读。目录漏洞背景漏洞成因影响评估检测方案 …...

编程日记 2026/4/24 6:09:27

HTML 学习记录

标签语法

基本骨架

HTML 部分

标签语法

基本骨架

标签关系

各种标签

1.标题标签 h1-h6

2.段落标签

3.单标签

4.文本格式化标签

5.图像 img

6.超链接

7.音频

8.视频

9.列表

10.表格

11.表单

input

下拉菜单

文本域

label标签

button

12.布局标签 div span

字符实体

路径

相关文章：