HTML速查
HTML 基本文档
<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>文档标题</title></head><body>可见文本...</body>
</html>
基本标签（Basic Tags）
<h1>最大的标题</h1>
<h2> . . . </h2>
<h3> . . . </h3>
<h4> . . . </h4>
<h5> . . . </h5>
<h6>最小的标题</h6>
<hr size="2px" color="blue" width="80%" align="left"> （水平线）
<p>这是一个段落。</p>
<br> （换行）
<font face="楷体" size="6" color="red">字体标签</font>
<!-- 这是注释 -->
文本格式化（Formatting）
<b>粗体文本</b>
<code>计算机代码</code>
<em>强调文本</em>
<i>斜体文本</i>
<u>有下划线文本</u>
<kbd>键盘输入</kbd>
<pre>预格式化文本</pre>
<small>更小的文本</small>
<strong>重要的文本</strong>
<abbr> （缩写）
<address> （联系信息）
<bdo> （文字方向）
<blockquote> （从另一个源引用的部分）
<cite> （工作的名称）
<del> （删除的文本）
<ins> （插入的文本）
<sub> （下标文本）
<sup> （上标文本）
链接（Links）
普通的链接：<a href="http://www.example.com/">链接文本</a>
图像链接： <a href="http://www.example.com/"><img src="URL" title="点我到达..." alt="替换文本"></a>
邮件链接： <a href="mailto:webmaster@example.com">发送e-mail</a>
书签：
<a id="tips">提示部分</a>
<a href="#tips">跳到提示部分</a>
图片（Images）
<img src="URL" title="图片标题" alt="替换文本" height="42" width="42">
样式/区块（Styles/Sections）
<style type="text/css">h1 {color:red;}p {color:blue;}
</style>
<div>文档中的块级元素</div> （占一整行）
<span>文档中的内联元素</span> （占一块）
无序列表
<ul><li>项目</li><li>项目</li>
</ul>
有序列表
<ol><li>第一项</li><li>第二项</li>
</ol>
定义列表
<dl><dt>项目 1</dt><dd>描述项目 1</dd><dt>项目 2</dt><dd>描述项目 2</dd>
</dl>
表格（Tables）
<table border="1"><tr><th>表格标题</th><th>表格标题</th></tr><tr><td>表格数据</td><td>表格数据</td></tr>
</table>
框架（Iframe）
<iframe src="demo_iframe.htm"></iframe>
表单（Forms）
<form action="demo_form.php" method="post/get">
<input type="text" name="email" size="40" maxlength="50"> （普通文本）
<input type="password"> （密码框）
<label for="name">用户名:</label> (label的for属性指向input标签的id属性)
<input type="text" id="name" name="name" required>
<input type="radio" checked="checked"> （单选框）
<input type="checkbox" checked="checked"> （复选框）
<input type="file"/> （上传文件）
<input type="date"/> （选择时间）
<input type="submit" value="Send"> （提交按钮）
<input type="reset"> （重置按钮）
<input type="hidden"> （隐藏域）
<select> （下拉选择框）
<option>苹果</option>
<option selected="selected">香蕉</option>
<option>樱桃</option>
</select>
<textarea name="comment" rows="60" cols="20"></textarea> （from标签的子标签，多行文本域）
</form>
标签通用属性：name（元素名），value（选择默认值），checked（默认选中），readonly（是否只读），disabled（是否可用），placeholder（提示信息）
实体（Entities）
< 等同于 <
> 等同于 >
© 等同于 ©
等同于 半个英语字母英文空格
  等同于 一个汉字中文空格
& 等同于&
× 等同于×
¥ 等同于￥
$ $
示例
<!DOCTYPE html>
<html>
<head><meta charset="utf-8"><title>我的示例页面</title><style type="text/css">h1 {color: red;}p {color: blue;}</style>
</head>
<body><h1>这是我的示例页面</h1>
<h2>基本内容</h2>
<p>这是一个段落，包含 <b>粗体文本</b> 和 <i>斜体文本</i>。</p><h3>文本格式化示例</h3>
<p><em>强调文本</em>, <kbd>键盘输入</kbd>,
<pre>预格式化文本</pre>
,
<small>更小的文本</small>, <strong>重要的文本</strong>
</p><h2>链接示例</h2>
<p>普通的链接：<a href="http://www.example.com/">访问示例网站</a></p>
<p>邮件链接：<a href="mailto:webmaster@example.com">发送邮件</a></p><h2>图片示例</h2>
<p><img src="https://via.placeholder.com/150" alt="替换文本" height="150" width="150"></p><h2>列表示例</h2>
<h3>无序列表</h3>
<ul><li>无序项目 1</li><li>无序项目 2</li>
</ul><h3>有序列表</h3>
<ol><li>第一项</li><li>第二项</li>
</ol><h3>定义列表</h3>
<dl><dt>项目 1</dt><dd>描述项目 1</dd><dt>项目 2</dt><dd>描述项目 2</dd>
</dl><h2>表格示例</h2>
<table border="1"><tr><th>表头 1</th><th>表头 2</th></tr><tr><td>表格数据 1</td><td>表格数据 2</td></tr>
</table><h2>框架示例</h2>
<iframe src="https://www.example.com" width="600" height="400"></iframe><h2>表单示例</h2>
<form action="demo_form.php" method="post"><label for="email">邮箱：</label><input type="text" id="email" name="email" size="40" maxlength="50"><br><br><label for="password">密码：</label><input type="password" id="password" name="password"><br><br><input type="checkbox" id="subscribe" name="subscribe" checked><label for="subscribe">订阅</label><br><input type="radio" id="option1" name="option" checked><label for="option1">选项 1</label><br><input type="radio" id="option2" name="option"><label for="option2">选项 2</label><br><input type="submit" value="发送"><input type="reset" value="重置"><br><br><select><option>苹果</option><option selected="selected">香蕉</option><option>樱桃</option></select><br><br><textarea name="comment" rows="4" cols="50" placeholder="在这里输入评论..."></textarea>
</form><h2>实体示例</h2>
<p>使用实体：< 等同于 <, > 等同于 >, © 等同于 ©.</p><hr> <!-- 水平线 -->
<footer><address>联系信息：<a href="mailto:webmaster@example.com">webmaster@example.com</a></address>
</footer>
</body>
</html>
相关文章：
HTML速查
HTML 基本文档 <!DOCTYPE html> <html><head><meta charset"utf-8"><title>文档标题</title></head><body>可见文本...</body> </html>基本标签（Basic Tags） <h1>最大的…...
day-102 二进制矩阵中的最短路径
思路 BFS 解题过程 从起点依次向八个方向尝试（之后也一样），如果某个位置在矩阵内且值为0且没有访问过，将其添加到一个队列中，依次类推，直到到达出口 Code class Solution {public int shortestPathBinar…...
SQL Server大批量数据插入
数据库连接及相关操作 public class DataBase {/*** 驱动*/private static final String DRIVER PropertiesUtil.getString("spring.datasource.driver-class-name");/*** 数据库地址*/private static final String URL PropertiesUtil.getString("spring.da…...
在 Ubuntu 下通过 Docker 部署 Caddy 服务器
嘿，伙伴们！今天我们来聊聊如何在 Ubuntu 系统下通过 Docker 部署 Caddy 服务器。Caddy 是一个现代的 Web 服务器，支持自动 HTTPS，简单易用，特别适合快速搭建网站。而 Docker 则是一个让你可以隔离和管理应用的神器。结…...
ZooKeeper注册中心实现
具体步骤 安装ZooKeeper（启动端口占用，2181：客户端，8080：管理端）引入客户端依赖实现注册中心接口SPI补充ZooKeeper注册中心 引入依赖 <!-- zookeeper --> <dependency><groupId>org.a…...
数仓建模：如何进行实体建模？
目录 1 如何进行实体建模？ 业务建模 领域建模 逻辑建模 2 实体建模具体步骤 需求分析...
Python编程技术
设计目的 该项目框架Scrapy可以让我们平时所学的技术整合旨在帮助学习者提高Python编程技能并熟悉基本概念： 1. 学习基本概念：介绍Python的基本概念，如变量、数据类型、条件语句、循环等。 2. 掌握基本编程技巧：教授学生如何使…...
「Mac玩转仓颉内测版55」应用篇2 - 使用函数实现更复杂的计算
本篇教程基于仓颉编程语言扩展了计算器功能，支持加减乘除的基础运算，以及幂运算和开平方等高级功能。代码经过简化后，移除了对输入的复杂校验，提升了程序的可维护性和交互效率。 关键词 仓颉编程语言函数封装高级运算 一、功能说…...
map参数详解
const items new Array(15).fill(null).map((_, index) > ({key: index 1,label: nav ${index 1}, })); $.map() 函数用于使用指定函数处理数组中的每个元素(或对象的每个属性)，并将处理结果封装为新的数组返回。 注意：1. 在jQuery 1.6 之前&#…...
OSI 七层模型 | TCP/IP 四层模型
注：本文为 “OSI 七层模型 | TCP/IP 四层模型” 相关文章合辑。 未整理去重。 OSI 参考模型（七层模型） BeretSEC 于 2020-04-02 15:54:37 发布 OSI 的概念 七层模型，亦称 OSI（Open System Interconnection…...
高转速风扇|无刷暴力风扇方案设计
在当今科技高速发展的时代，电子设备的性能不断提升，散热问题也日益成为关注的焦点。而 13w 高转速暴力风扇方案的出现，为解决各种设备的散热难题提供了强大的技术支持。 一、高转速暴力风扇的重要性 随着电子设备的不断升级，其功率…...
GPU 进阶笔记（三）：华为 NPU/GPU 演进
大家读完觉得有意义记得关注和点赞！！！ 1 术语 1.1 CPU1.2 GPU1.3 NPU / TPU1.4 小结2 华为 DaVinci 架构：一种方案覆盖所有算力场景 2.1 场景、算力需求和解决方案2.2 Ascend NPU 设计3 路线一：NPU 用在手机芯片&…...
计算机网络 （13）信道复用技术
前言 计算机网络中的信道复用技术是一种提高网络资源利用率的关键技术。它允许在一条物理信道上同时传输多个用户的信号，从而提高了信道的传输效率和带宽利用率。 一、信道复用技术的定义 信道复用（Multiplexing）就是在一条传输媒体上同时传输…...
数据库约束和查询
一 约束意义 这个后面的字段是什么意思呢? 先前说数据类型是一种约束，约束我们只能放该类型的数据，还有其它的约束来保证数据的合法性，下面的字段就和约束有关。 编译器的编译就是一个约束，保证我们的代码一定是语法合格的。我们…...
网工日记：FTP两种工作模式的区别
FTP 的主动模式和被动模式在连接建立的发起方、数据传输端口以及对网络环境的适应性等方面存在明显区别： 1. 连接发起方 主动模式：数据连接由服务器主动发起。在控制连接建立后，客户端通过 PORT 命令告知服务器自己用于接收数据的临时端口号…...
NLP模型工程化部署
文章目录 一、理论-微服务、测试与GPU1）微服务架构2）代码测试3）GPU使用 二、实践-封装微服务，编写测试用例和脚本，并观察GPU1）微服务封装(RestFul和RPC)2）测试编写(unit_test\api_test\load_tes…...
分布式版本管理工具——git 中忽略文件的版本跟踪（初级方法及高级方法）
git工具忽略指定文件的版本跟踪 一、简单方式实现二、复杂方式实现（模式匹配）1. 相关规则2. 应用案例a) 忽略所有内容b) 忽略所有目录（不忽略当前目录的具体文件）c)忽略指定目录下的所有文件，但排除某文件d）…...
【LangChain】Chapter4 - Question and Answer Over Documents
说在前面 文档问答，是常见的一类LLM应用，给定一段可能是从 PDF文件、网页或某公司内部文档库中提取的文本，使用LLM回答关于这些文档内容的问题。这样的应用非常的强大，它可以将LLM与完全没被训练的数据相结合，可以灵活…...
TCP/IP 协议演进中的瓶颈，权衡和突破
所有(去掉 “几乎” 修饰)问题都来自于生长速度的不一致，换句话说，膨胀不是均匀的，从而产生瓶颈甚至触碰极限，TCP/IP 从协议到实现面临的多方问题与动物体型不能无限大，摩天大楼不能无限高本质上一样。 如今被高性能网…...
软件测试面试八股文，查漏补缺（附文档）
大家好，最近有不少小伙伴在后台留言，准备面试了，又不知道从何下手！为了帮大家节约时间，特意准备了一份面试相关的资料，内容非常的全面，真的可以好好补一补，希望大家在都能拿到理想的…...
2025年能源电力系统与流体力学国际会议 (EPSFD 2025)
2025年能源电力系统与流体力学国际会议（EPSFD 2025）将于本年度在美丽的杭州盛大召开。作为全球能源、电力系统以及流体力学领域的顶级盛会，EPSFD 2025旨在为来自世界各地的科学家、工程师和研究人员提供一个展示最新研究成果、分享实践经验及…...
2021-03-15 iview一些问题
1.iview 在使用tree组件时，发现没有set类的方法，只有get，那么要改变tree值，只能遍历treeData，递归修改treeData的checked，发现无法更改，原因在于check模式下，子元素的勾选状态跟父节…...
管理学院权限管理系统开发总结
文章目录 🎓 管理学院权限管理系统开发总结 - 现代化Web应用实践之路📝 项目概述🏗️ 技术架构设计后端技术栈前端技术栈 💡 核心功能特性1. 用户管理模块2. 权限管理系统3. 统计报表功能4. 用户体验优化 🗄️ 数据库设…...
Linux离线（zip方式）安装docker
目录 基础信息操作系统信息docker信息 安装实例安装步骤示例 遇到的问题问题1：修改默认工作路径启动失败问题2 找不到对应组 基础信息 操作系统信息 OS版本：CentOS 7 64位 内核版本：3.10.0 相关命令： uname -rcat /etc/os-rele…...
spring Security对RBAC及其ABAC的支持使用
RBAC (基于角色的访问控制) RBAC (Role-Based Access Control) 是 Spring Security 中最常用的权限模型，它将权限分配给角色，再将角色分配给用户。 RBAC 核心实现 1. 数据库设计 users roles permissions ------- ------…...
何谓AI编程【02】AI编程官网以优雅草星云智控为例建设实践-完善顶部-建立各项子页-调整排版-优雅草卓伊凡
何谓AI编程【02】AI编程官网以优雅草星云智控为例建设实践-完善顶部-建立各项子页-调整排版-优雅草卓伊凡 背景 我们以建设星云智控官网来做AI编程实践，很多人以为AI已经强大到不需要程序员了，其实不是，AI更加需要程序员，普通人…...
boost::filesystem::path文件路径使用详解和示例
boost::filesystem::path 是 Boost 库中用于跨平台操作文件路径的类，封装了路径的拼接、分割、提取、判断等常用功能。下面是对它的使用详解，包括常用接口与完整示例。 1. 引入头文件与命名空间 #include <boost/filesystem.hpp> namespace fs b…...
边缘计算网关提升水产养殖尾水处理的远程运维效率
一、项目背景 随着水产养殖行业的快速发展，养殖尾水的处理成为了一个亟待解决的环保问题。传统的尾水处理方式不仅效率低下，而且难以实现精准监控和管理。为了提升尾水处理的效果和效率，同时降低人力成本，某大型水产养殖企业决定…...
Canal环境搭建并实现和ES数据同步
作者：田超凡 日期：2025年6月7日 Canal安装，启动端口11111、8082： 安装canal-deployer服务端： https://github.com/alibaba/canal/releases/1.1.7/canal.deployer-1.1.7.tar.gz cd /opt/homebrew/etc mkdir canal…...
渗透实战PortSwigger Labs指南：自定义标签XSS和SVG XSS利用
阻止除自定义标签之外的所有标签 先输入一些标签测试，说是全部标签都被禁了 除了自定义的 自定义<my-tag onmouseoveralert(xss)> <my-tag idx onfocusalert(document.cookie) tabindex1> onfocus 当元素获得焦点时（如通过点击或键盘导航&…...