HTML笔记2
11，路径
<!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>
<!-- 相对路径 -->
<!-- 1jpg -->
<img src="./1.jpg" alt=""><br>
<!-- 2jpg -->
<img src="../2.png" alt=""><br>
<!-- 3jpg -->
<img src="../../3.png" alt=""><br>
<!-- 绝对路径 -->
<!-- 1.jpg在自己电脑里的图片 -->
<img src="C:\Users\user\Desktop\vc\photo\picture\code\1.jpg" alt=""><br>
<!-- 不在自己电脑里的图片复制图片地址 -->
<img src="https://static.web.sdo.com/jijiamobile/pic/ff14/wallpaper/20221220patch62/ffxiv_6.2patch_01_300x169.jpg" alt="">
</body>
</html>
12， 超链接
<a href="...">
<!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>
<!-- 点击跳转 -->
<a href="https://www.baidu.com/">跳转到百度</a><br>
<a href="./01—标签的写法.html">跳转到01——标签的写法</a><br>
<!-- 打开为新页面 target="_blank" -->
<a href="./01—标签的写法.html" target="_blank">跳转到01——标签的写法新页面</a>
<!-- herf属性值写#，不会跳转 -->
<a href="#">不会跳转</a>
</body>
</html>
13，音频标签
<audio src="..." controls loop aotoplay></audio>
<!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>
<!-- 在hmtl5里面，属性名和属性值完全一样，则可以简写为一个单词，如controls -->
<audio src="./BUMP OF CHICKEN - Hello,world!.flac" controls loop aotoplay></audio>
</body>
</html>
14，视频标签
<video src="..." controls loop muted aotoplay></video>
<!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>
<video src="./视频.mp4" controls loop muted aotoplay></video>
</body>
</html>
15，列表标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!-- 无序列表 -->
<ul>
<li>条目列表1</li>
<li>条目列表2</li>
<li>条目列表3</li>
</ul>
<!-- 有序列表 -->
<ol>
<li>第一名</li>
<li>第二名</li>
<li>第三名</li>
</ol>
<!-- 定义列表 -->
<dl>
<dt>防护职能</dt><br>
<dd>剑盾小b</dd>
<dd>撅枪小b</dd>
<dd>绿刀小b</dd>
<dd>暗堕小b</dd>
</dl>
</body>
</html>
16，表格标签
<!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>
<!-- 表格结构标签 -->
<table border="1">
<thead>
<tr>
<th>姓名 </th>
<th>语文</th>
<th>数学</th>
<th>总分</th>
</tr>
</thead>
<tbody>
<tr>
<td>张三</td>
<td>99</td>
<td>97</td>
<td>196</td>
</tr>
<tr>
<td>李四</td>
<td>97</td>
<td>97</td>
<td>194</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>平均分</td>
<td>98</td>
<td>97</td>
<td>195</td>
</tr>
</tfoot>
</table>
</body>
</html>
17，合并单元格
<!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>
<table border="1">
<thead>
<tr>
<th>姓名 </th>
<th>语文</th>
<th>数学</th>
<th>总分</th>
</tr>
</thead>
<tbody>
<tr>
<td>张三</td>
<td>99</td>
<td rowspan="2">97</td>
<td>196</td>
</tr>
<tr>
<td>李四</td>
<td>97</td>
<td>194</td>
</tr>
</tbody>
<tr>
<td>平均分</td>
<td>98</td>
<td>97</td>
<td>195</td>
</tr>
<tfoot>
<tr>
<td>排名</td>
<td colspan="3">全市第一</td>
<!-- <td>全市第一</td> -->
<!-- <td>全市第一</td> -->
</tr>
</tfoot>
</table>
</body>
</html>
18， 表单
文本框：<input type="text">
密码框：<input type="password">
单选框： <input type="radio">
多选框1： <input type="checkbox" >
多选框2： <input type="checkbox" >
上传文件： <input type="file">
占位文本：<input type="password" placeholder="请输入密码">
默认选中：<checked>
上传多个文件： <input type="file" multiple>
<!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>
<!-- 输入什么，客户页面就显示什么 -->
文本框：<input type="text">
<br><br>
<!-- 输入什么都显示为星号 -->
密码框：<input type="password">
<br><br>
<!-- 单选 -->
单选框: <input type="radio">
<br><br>
<!-- 多选 -->
多选框1: <input type="checkbox" >
多选框2: <input type="checkbox" >
<br><br>
<!-- 上传文件夹 -->
上传文件: <input type="file">
<br><br>
<!-- 占位文本 -->
文本框:<input type="text" placeholder="请输入用户名">
<br><br>
密码框:<input type="password" placeholder="请输入密码">
<br><br>
<!-- radio单选功能的实现用name，默认选中checked -->
性别:
<input type="radio" name="gender" checked> 男
<input type="radio" name="gender"> 女
<br><br>
<!-- 上传多个文件 -->
上传多个文件: <input type="file" multiple>
<br><br>
<!-- 默认多选 -->
用户协议:
<br>
<input type="checkbox" checked>条款一<br>
<input type="checkbox" checked>条款二
</body>
</html>
19，下拉菜单
<select>
<option>...</option>
</select>
<!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>
城市:
<select>
<option>北京</option>
<option>上海</option>
<option>广州</option>
<!-- selected 属性规定在页面加载时预先选定该选项 -->
<option selected>深圳</option>
</select>
</body>
</html>
20,，文本域
<textarea>...</textarea>
<!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>
<!-- 右下角可拖拽放大，以后会禁用 -->
<textarea>请输入评论</textarea>
</body>
</html>
相关文章：
HTML笔记2
11，路径 <!DOCTYPE html> <html lang"en"> <head> <meta charset"UTF-8"> <meta name"viewport" content"widthdevice-width, initial-scale1.0"> <title>Document</title> <…...
使用Docker实现Jenkins+Python + Pytest +Allure 接口自动化
一、Jenkins搭建 参考《Docker 安装 Jenkins》 进入 jenkins 容器 CLI 界面 docker exec -itu root jenkins /bin/bash二、准备条件 1、替换镜像内源 为了安装wget，默认用yum会安装不上wget命令，参考文章《docker容器内如何更换yum源【只想换成国内…...
论企业安全漏洞扫描的重要性
前言 随着信息技术的迅猛发展和互联网的广泛普及，网络安全问题日益凸显。在这个数字化的世界里，无论是企业还是个人，都面临着前所未有的安全威胁。安全漏洞，作为这些威胁的源头，常常被忽视或无法及时发现。 而安全漏洞…...
23.网络游戏逆向分析与漏洞攻防-网络通信数据包分析工具-实现配置工具数据结构
免责声明：内容仅供学习参考，请合法利用知识，禁止进行违法犯罪活动！ 如果看不懂、不知道现在做的什么，那就跟着做完看效果 内容参考于：易道云信息技术研究院VIP课 上一个内容：22.加载配置文件…...
STM32CubeMX学习笔记20——SD卡FATFS文件系统
1. FATFS文件系统简介 文件系统是操作系统用于明确存储设备或分区上的文件的方法和数据结构（即在存储设备上组织文件的方法）。操作系统中负责管理和存储文件信息的软件机构称为文件管理系统，简称文件系统；不带文件系统的SD卡仅能…...
Facebook商城号为什么被封？如何防封？
由于Facebook商城的高利润空间，越来越多的跨境电商商家注意到它的存在。Facebook作为全球最大、用户量最大的社媒平台，同时也孕育了一个巨大的商业生态，包括广告投放、商城交易等。依托背后的大流量，Facebook商城起号较快…...
【教程】APP备案全攻略：确保你的应用合规上线
【教程】APP备案全攻略：确保你的应用合规上线 摘要 本文详细介绍了中国大陆地区互联网信息服务提供者（AP）进行APP备案的流程、要求和注意事项。包括备案对象、备案方式、备案内容、备案流程等方面的详细说明，帮助开发者顺利完成…...
Vue入门2
v-model 原理：v-model本质上是一个语法糖。例如应用于输入框，就是value属性和input事件的合写。 作用：提供数据的双向绑定 数据变，视图跟着变 :value视图变，数据跟着变 input 注意：$event用于在模板中&…...
简介：CMMI软件能力成熟度集成模型
前言 CMMI是英文Capability Maturity Model Integration的缩写。 CMMI认证简称软件能力成熟度集成模型，是鉴定企业在开发流程化和质量管理上的国际通行标准，全球软件生产标准大都以此为基点，并都努力争取成为CMMI认证队伍中的一分子。 对一个…...
mysql的其他问题
1.MySQL数据库作发布系统的存储，一天五万条以上的增量，预计运维三年,怎么优化？ a. 设计良好的数据库结构，允许部分数据冗余，尽量避免join查询，提高效率。 b. 选择合适的表字段数据类型和存储引擎…...
数据结构---复杂度（2）
1.斐波那契数列的时间复杂度问题 每一行分别是2^0---2^1---2^2-----2^3-------------------------------------------2^(n-2) 利用错位相减法，可以得到结果是，2^(n-1)-1,其实还是要减去右下角的灰色部分，我们可以拿简单的数字进行举例子&…...
【设计模式】设计原则和常见的23种经典设计模式
设计模式 1. 设计原则（记忆口诀：SOLID）【记忆口诀：单开里依接迪合（单开礼仪接地和）】 （1）单一职责原则（Single Responsibility Principle, SRP） ÿ…...
Spring Cloud Gateway自定义断言
问题：Spring Cloud Gateway自带的断言（Predicate）不满足业务怎么办？可以自定义断言！ 先看Spring Cloud Gateway是如何实现断言的 Gateway中断言的整体架构如下： public abstract class AbstractRoutePred…...
智能测径仪在胶管行业的应用
关键字：胶管外径尺寸测量，胶管检测仪器，胶管外径检测，高温胶管外径检测，软硬胶管检测， 智能测径仪在家胶管行业中的应用主要体现在对胶管外径的精确测量和控制上。在胶管生产过程中，外径的大小直…...
vue自定义主题皮肤方案
方案一：CSS变量换肤（推荐） 利用css定义变量的方法，用var在全局定义颜色变量（需将变量提升到全局即伪类选择器 :root）然后利用js操作css变量，document.getElementsByTagName(‘body’)[0].style…...
iOS中使用schema协议调用APP和使用iframe打开APP的例子
大家好我是咕噜美乐蒂，很高兴又和大家见面了！ 当调用自定义 URL scheme 或使用 iframe 打开应用程序时，可以采取以下详细步骤： 使用自定义 URL scheme 协议调用应用程序 1.首先，确认目标应用程序已经注册了自定义 U…...
2024.3.11
提示并输入一个字符串，统计该字符中大写、小写字母个数、数字个数、空格个数以及其他字符个数 #include <iostream> #include<string> using namespace std;int main() {cout << "please input a string:" << endl;string str;g…...
Web服务器需要警惕的一些安全隐患
Web服务器需要警惕的一些安全隐患有哪些，今天德迅云安全就带您来了解下。熟悉了解了就知道怎么规避风险。不过无论是什么漏洞，都体现着安全是一个整体的真理，考虑Web服务器的安全性，必须要考虑到与之相配合的操作系统。 1.物理路径…...
MinGW-w64的下载与安装
文章目录 1 下载2 安装3 配置环境变量4 验证 1 下载 官网地址：https://www.mingw-w64.org/github地址：https://github.com/niXman/mingw-builds-binaries/releases windows下载 跳转github下载 版本号选择：13.2.0是GCC的版本号；…...
docker使用笔记
查看本机上所有镜像 docker images打包项目（打包完成后自动载入镜像） The command docker build -t search-server . you provided is a standard way to build a Docker image. The -t flag tags the resulting image, and search-server is the tag …...
Python｜GIF 解析与构建（5）：手搓截屏和帧率控制
目录 Python｜GIF 解析与构建（5）：手搓截屏和帧率控制 一、引言 二、技术实现：手搓截屏模块 2.1 核心原理 2.2 代码解析：ScreenshotData类 2.2.1 截图函数：capture_screen 三、技术实现&…...
Cilium动手实验室: 精通之旅---20.Isovalent Enterprise for Cilium: Zero Trust Visibility
Cilium动手实验室: 精通之旅---20.Isovalent Enterprise for Cilium: Zero Trust Visibility 1. 实验室环境1.1 实验室环境1.2 小测试 2. The Endor System2.1 部署应用2.2 检查现有策略 3. Cilium 策略实体3.1 创建 allow-all 网络策略3.2 在 Hubble CLI 中验证网络策略源3.3 …...
Linux云原生安全：零信任架构与机密计算
Linux云原生安全：零信任架构与机密计算 构建坚不可摧的云原生防御体系 引言：云原生安全的范式革命 随着云原生技术的普及，安全边界正在从传统的网络边界向工作负载内部转移。Gartner预测，到2025年，零信任架构将成为超…...
相机Camera日志分析之三十一：高通Camx HAL十种流程基础分析关键字汇总（后续持续更新中）
【关注我，后续持续新增专题博文，谢谢！！！】 上一篇我们讲了：有对最普通的场景进行各个日志注释讲解，但相机场景太多，日志差异也巨大。后面将展示各种场景下的日志。 通过notepad++打开场景下的日志，通过下列分类关键字搜索，即可清晰的分析不同场景的相机运行流程差异…...
NLP学习路线图（二十三）：长短期记忆网络（LSTM）
在自然语言处理（NLP）领域，我们时刻面临着处理序列数据的核心挑战。无论是理解句子的结构、分析文本的情感，还是实现语言的翻译，都需要模型能够捕捉词语之间依时序产生的复杂依赖关系。传统的神经网络结构在处理这种序列依赖时显得力不从心，而循环神经网络（RNN） 曾被视为…...
【HTTP三个基础问题】
面试官您好！HTTP是超文本传输协议，是互联网上客户端和服务器之间传输超文本数据（比如文字、图片、音频、视频等）的核心协议，当前互联网应用最广泛的版本是HTTP1.1，它基于经典的C/S模型，也就是客…...
搭建DNS域名解析服务器(正向解析资源文件)
正向解析资源文件 1）准备工作 服务端及客户端都关闭安全软件 [rootlocalhost ~]# systemctl stop firewalld [rootlocalhost ~]# setenforce 0 2）服务端安装软件：bind 1.配置yum源 [rootlocalhost ~]# cat /etc/yum.repos.d/base.repo [Base…...
基于PHP的连锁酒店管理系统
有需要请加文章底部Q哦 可远程调试 基于PHP的连锁酒店管理系统 一 介绍 连锁酒店管理系统基于原生PHP开发，数据库mysql，前端bootstrap。系统角色分为用户和管理员。 技术栈 phpmysqlbootstrapphpstudyvscode 二 功能 用户 1 注册/登录/注销 2 个人中…...
MySQL：分区的基本使用
目录 一、什么是分区二、有什么作用三、分类四、创建分区五、删除分区 一、什么是分区 MySQL 分区（Partitioning）是一种将单张表的数据逻辑上拆分成多个物理部分的技术。这些物理部分（分区）可以独立存储、管理和优化，…...
热烈祝贺埃文科技正式加入可信数据空间发展联盟
2025年4月29日，在福州举办的第八届数字中国建设峰会“可信数据空间分论坛”上，可信数据空间发展联盟正式宣告成立。国家数据局党组书记、局长刘烈宏出席并致辞，强调该联盟是推进全国一体化数据市场建设的关键抓手。 郑州埃文科技有限公司&am…...