html5cssjs代码 023 公制计量单位进位与换算表
html5&css&js代码 023 公制计量单位进位与换算表
- 一、代码
- 二、解释
这段HTML代码定义了一个网页，用于展示公制计量单位的进位与换算表。
一、代码
<!DOCTYPE html>
<html lang="zh-cn">
<head><meta charset="utf-8"/><title>公制计量单位进位与换算表</title><style>body {margin: 0;padding: 0;font-family: Arial, sans-serif;background-color: #222;color: #fff;display: block;text-align: center;}table {margin: 0 auto;border-collapse: collapse;width: 80%;max-width: 1000px;}th, td {text-align: left;padding: 10px;border: 1px solid #444;}th {text-align: center;font-size: 1.5em;background-color: #333;color: #eeeeee;}tr:nth-child(even) {background-color: #282828;}.sh {color: #ffa500;font-size: 1.5em;font-weight: bold;}</style>
</head>
<body>
<h1>公制计量单位进位与换算表</h1>
<table><thead><tr><th>单位</th><th>换算关系</th></tr></thead><tbody><!-- 长度单位 --><tr><td class="sh" colspan="2">长度单位</td></tr><tr><td>公里 (km)</td><td>1 km = 1000 米 (m)</td></tr><tr><td>米 (m)</td><td>1 m = 10 分米 (dm)</td></tr><tr><td>分米 (dm)</td><td>1 dm = 10 厘米 (cm)</td></tr><tr><td>厘米 (cm)</td><td>1 cm = 10 毫米 (mm)</td></tr><tr><td>毫米 (mm)</td><td>1 mm = 1000 微米 (µm)</td></tr><tr><td>微米 (µm)</td><td>1 µm = 1000 纳米 (nm)</td></tr><!-- 面积单位 --><tr><td class="sh" colspan="2">面积单位</td></tr><tr><td>平方公里 (km²)</td><td>1 km² = 1,000,000 平方米 (m²)</td></tr><tr><td>平方米 (m²)</td><td>1 m² = 10,000 平方厘米 (cm²)</td></tr><tr><td>平方厘米 (cm²)</td><td>1 cm² = 100 平方毫米 (mm²)</td></tr><!-- 体积与容量单位 --><tr><td class="sh" colspan="2">体积与容量单位</td></tr><tr><td>立方米 (m³)</td><td>1 m³ = 1000 升 (L)</td></tr><tr><td>升 (L)</td><td>1 L = 1000 毫升 (mL)</td></tr><tr><td>毫升 (mL)</td><td>1 mL = 1 立方厘米 (cm³)</td></tr><!-- 质量单位 --><tr><td class="sh" colspan="2">质量单位</td></tr><tr><td>吨 (t)</td><td>1 t = 1000 千克 (kg)</td></tr><tr><td>千克 (kg)</td><td>1 kg = 1000 克 (g)</td></tr><tr><td>克 (g)</td><td>1 g = 1000 毫克 (mg)</td></tr><tr><td>毫克 (mg)</td><td>1 mg = 1000 微克 (µg)</td></tr><!-- 时间单位 --><tr><td class="sh" colspan="2">时间单位</td></tr><tr><td>年</td><td>1 年 ≈ 365.25 天 (d)</td></tr><tr><td>天 (d)</td><td>1 d = 24 小时 (h)</td></tr><tr><td>小时 (h)</td><td>1 h = 60 分钟 (min)</td></tr><tr><td>分钟 (min)</td><td>1 min = 60 秒 (s)</td></tr><tr><td>秒 (s)</td><td>1 s = 1000 毫秒 (ms)</td></tr><tr><td>毫秒 (ms)</td><td>1 ms = 1000 微秒 (µs)</td></tr><!-- 温度单位 --><tr><td class="sh" colspan="2">温度单位</td></tr><tr><td>摄氏度 (°C)</td><td>K = °C + 273.15 (开尔文温度)</td></tr><tr><td>开尔文 (K)</td><td>°C = K - 273.15 (摄氏度)</td></tr></tbody>
</table>
</body>
<footer style="text-align: center;margin: 30px;font-size: 1.5rem;font-weight: bold;color: #ffcc00;">HTML+CSS+JavaScript编程配套代码 作者：明月看潮生
</footer>
</html>
二、解释
这段HTML代码定义了一个网页，用于展示公制计量单位的进位与换算表。网页采用了基本的HTML结构，包括<!DOCTYPE html>声明、<html>标签、<head>标签和<body>标签等。
在<head>部分，设置了网页的语言为简体中文，指定了字符编码为UTF-8，以及定义了一个CSS样式表，用于美化网页的显示效果。
在<body>部分，首先使用<h1>标签显示网页的标题，然后使用<table>标签创建一个表格，用于展示各种计量单位之间的换算关系。表格中包含了长度单位、面积单位、体积与容量单位、质量单位、时间单位和温度单位等。每个单位都用标签表示一行，其中<td>标签用于显示单元格中的内容，而<th>标签则用于显示表头。
此外，还使用了CSS类sh来标识并设置章节标题的样式，使得其在表格中更加突出。最后，在网页的底部使用<footer>标签添加了一个页脚，显示了代码的作者信息。
整体而言，这段HTML代码通过表格和样式的方式，清晰地呈现了公制计量单位之间的进位与换算关系，方便用户查阅和学习。
相关文章：
html5cssjs代码 023 公制计量单位进位与换算表
html5&css&js代码 023 公制计量单位进位与换算表 一、代码二、解释 这段HTML代码定义了一个网页，用于展示公制计量单位的进位与换算表。 一、代码 <!DOCTYPE html> <html lang"zh-cn"> <head><meta charset"utf-8&quo…...
UE5.3 StateTree使用实践
近期浏览UE的CitySample（黑客帝国Demo），发现有不少逻辑用到了StateTree学习一下，StateTree是多层状态机实现，以组件的形式直接挂载在蓝图中运行。 与平时常见的一些FSM库不同，StateTree并不会返回给外界当…...
【09】进阶JavaScript事件循环Promise
一、事件循环 浏览器的进程模型 何为进程？ 程序运行需要有它自己专属的内存空间，可以把这块内存空间简单的理解为进程 每个应用至少有一个进程，进程之间相互独立，即使要通信，也需要双方同意。 何为线程？ 有了进程后，就可以运行程序的代码了。 运行代码的「人」称之…...
蓝桥备赛----基本语法总结
文章目录 输入输出知识点总结 输入 单个 #单个输入n input() #无参数 默认返回字符串n input("有提示参数的输入") #有提示性输入语句的输入，仍是以str类型返回n int(input()) #根据给定的类型输入，返回值类型intn float(input()) #根据…...
基于 Echarts + Python Flask ，我搭建了一个动态实时大屏监管系统
一、效果展示 1. 动态实时更新数据效果图 2. 鼠标右键切换主题 二、确定需求方案 支持Windows、Linux、Mac等各种主流操作系统；支持主流浏览器Chrome，Microsoft Edge，360等；服务器采用python语言编写，配置好python环…...
针对教育行业的网络安全方案有哪些
智慧校园”是教育信息化进入高级阶段的表现形式，比“数字校园”更先进。集体知识共融、共生、业务应用融合创新、移动互联网物联网高速泛在是其重要特征。特别是在互联网教育的大环境下，为了更好的发挥智慧化教学服务和智慧化教学管理功能，需…...
C++ 编程入门指南：深入了解 C++ 语言及其应用领域
C 简介 什么是 C？ C 是一种跨平台的编程语言，可用于创建高性能应用程序。 C 是由 Bjarne Stroustrup 开发的，作为 C 语言的扩展。 C 为程序员提供了对系统资源和内存的高级控制。 该语言在 2011 年、2014 年、2017 年和 2020 年进行了 4…...
latex变量上下加自适应长度箭头
latex变量上下加自适应长度箭头 在变量上加箭头的代码如下 % 在上 \overrightarrow{A B} \overleftarrow{A B} % 在下 \underrightarrow{A B} \underleftarrow{A B}得出的结果依次如下 A B → , A B ← , A B → , A B ← \overrightarrow{A B},\overleftarrow{A B}, \under…...
鸿蒙4.0ArkUI快速入门（一）应用模型
ArkUI篇 应用模型Stage模型FA模型模型对比 应用模型 应用模型是HarmonyOS为开发者提供的应用程序所需能力的抽象提炼，它提供了应用程序必备的组件和运行机制。 HarmonyOS先后提供了两种应用模型： FA（Feature Ability）模型&…...
C++ UML类图
参考文章： （1）C UML类图详解 （2）C基础——用C实例理解UML类图 （3）C设计模式——UML类图 （4）[UML] 类图介绍 —— 程序员（灵魂画手）必备画图技能之…...
Java SE入门及基础（44）
目录 I / O流(上) 1. 什么是I / O流 过程分析 I / O的来源 Java 中的 I / O流 2. 字节流 OutputStream 常用方法 文件输出流 FileOutputStream 构造方法 示例 InputStream 常用方法 文件输入流 FileInputStream 构造方法 示例 综合练习 字节流应用场景 Java SE文…...
基于Wechaty的微信机器人
git地址：GitHub - wechaty/getting-started: A Starter Project Template for Wechaty works out-of-the-boxhttps://github.com/wechaty/getting-started 在 Terminal中npm install 下载node包 加载完成后。npm start 启动 扫描二维码，即可登录微信web端…...
【C++ leetcode】双指针问题（续）
3. 202 .快乐数 题目 编写一个算法来判断一个数 n 是不是快乐数。 「快乐数」 定义为： 对于一个正整数，每一次将该数替换为它每个位置上的数字的平方和。然后重复这个过程直到这个数变为 1，也可能是 无限循环 但始终变不到 1。如果这个过程 结…...
51单片机-蜂鸣器
1.蜂鸣器的介绍 无源蜂鸣器不能一直通电，无源蜂鸣器内部的线圈较小，易烧坏 蜂鸣器的驱动 达林顿晶体管（npn型） 应用： 按下独立按键同时蜂鸣器响起提示音，数码管显示对应的独立按键键码 #include <REG…...
【MySQL】学习和总结使用列子查询查询员工工资信息
🌈个人主页: Aileen_0v0 🔥热门专栏: 华为鸿蒙系统学习|计算机网络|数据结构与算法 💫个人格言:“没有罗马,那就自己创造罗马~” #mermaid-svg-5odctDvQ0AHJJc1C {font-family:"trebuchet ms",verdana,arial,sans-serif;font-siz…...
突破编程_C++_STL教程（ stack 的实战应用）
1 std::stack 应用于自定义数据结构 通常，std::stack 用于存储基本数据类型，如 int、float、char 等。然而，std::stack 同样可以存储自定义的数据结构，只要这些数据结构满足一定的要求。 （1）存储自定义数…...
Spring Data访问Elasticsearch----其他Elasticsearch操作支持
Spring Data访问Elasticsearch----其他Elasticsearch操作支持 一、索引设置二、索引映射三、Filter Builder四、为大结果集使用滚动Scroll五、排序选项六、运行时字段6.1 索引映射中的运行时字段定义6.2 在查询上设置的运行时字段定义 七、Point In Time (PIT) API八、搜索模板…...
代码随想录算法训练营第60天 | 84.柱状图中最大的矩形
单调栈章节理论基础： https://leetcode.cn/problems/daily-temperatures/ 84.柱状图中最大的矩形 题目链接：https://leetcode.cn/problems/largest-rectangle-in-histogram/description/ 思路： 本题双指针的写法整体思路和42. 接雨水是一…...
【讲解Node.js常用的命令】进阶版
Node.js常用命令 Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行时环境，它使得可以在服务器端运行 JavaScript 代码。Node.js 采用了事件驱动、非阻塞 I/O 模型，非常适用于构建高效的网络应用程序。以下是一些Node.js开发中常用的命令࿱…...
软考81-上午题-【面向对象技术3-设计模式】-行为型设计模式01
一、行为型设计模式一览 二、责任链模式 2-1、意图 使多个对象都有机会处理请求，从而避免请求的发送者和接收者之间的耦合关系。将这些对象连成一条链，并沿着这条链传递该请求，直到有一个对象处理它为止。 1-2、结构 1-3、代码实现 1-4、适…...
Linux链表操作全解析
Linux C语言链表深度解析与实战技巧 一、链表基础概念与内核链表优势1.1 为什么使用链表？1.2 Linux 内核链表与用户态链表的区别 二、内核链表结构与宏解析常用宏/函数 三、内核链表的优点四、用户态链表示例五、双向循环链表在内核中的实现优势5.1 插入效率5.2 安全…...
论文解读：交大港大上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架（一）
宇树机器人多姿态起立控制强化学习框架论文解析 论文解读：交大&港大&上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化学习框架（一） 论文解读：交大&港大&上海AI Lab开源论文 | 宇树机器人多姿态起立控制强化…...
大模型多显卡多服务器并行计算方法与实践指南
一、分布式训练概述 大规模语言模型的训练通常需要分布式计算技术，以解决单机资源不足的问题。分布式训练主要分为两种模式： 数据并行：将数据分片到不同设备，每个设备拥有完整的模型副本 模型并行：将模型分割到不同设备，每个设备处理部分模型计算 现代大模型训练通常结合…...
mysql已经安装，但是通过rpm -q 没有找mysql相关的已安装包
文章目录 现象：mysql已经安装，但是通过rpm -q 没有找mysql相关的已安装包遇到 rpm 命令找不到已经安装的 MySQL 包时，可能是因为以下几个原因：1.MySQL 不是通过 RPM 包安装的2.RPM 数据库损坏3.使用了不同的包名或路径4.使用其他包…...
比较数据迁移后MySQL数据库和OceanBase数据仓库中的表
设计一个MySQL数据库和OceanBase数据仓库的表数据比较的详细程序流程，两张表是相同的结构，都有整型主键id字段，需要每次从数据库分批取得2000条数据，用于比较，比较操作的同时可以再取2000条数据，等上一次比较完成之后，开始比较，直到比较完所有的数据。比较操作需要比较…...
tomcat入门
1 tomcat 是什么 apache开发的web服务器可以为java web程序提供运行环境tomcat是一款高效，稳定，易于使用的web服务器tomcathttp服务器Servlet服务器 2 tomcat 目录介绍 -bin #存放tomcat的脚本 -conf #存放tomcat的配置文件 ---catalina.policy #to…...
数据库——redis
一、Redis 介绍 1. 概述 Redis（Remote Dictionary Server）是一个开源的、高性能的内存键值数据库系统，具有以下核心特点： 内存存储架构：数据主要存储在内存中，提供微秒级的读写响应 多数据结构支持&…...
Java中栈的多种实现类详解
Java中栈的多种实现类详解：Stack、LinkedList与ArrayDeque全方位对比 前言一、Stack类——Java最早的栈实现1.1 Stack类简介1.2 常用方法1.3 优缺点分析 二、LinkedList类——灵活的双端链表2.1 LinkedList类简介2.2 常用方法2.3 优缺点分析 三、ArrayDeque类——高…...
计算机系统结构复习-名词解释2
1.定向：在某条指令产生计算结果之前，其他指令并不真正立即需要该计算结果，如果能够将该计算结果从其产生的地方直接送到其他指令中需要它的地方，那么就可以避免停顿。 2.多级存储层次：由若干个采用不同实现技术的存储…...
用 FFmpeg 实现 RTMP 推流直播
RTMP（Real-Time Messaging Protocol） 是直播行业中常用的传输协议。 一般来说，直播服务商会给你： ✅ 一个 RTMP 推流地址（你推视频上去） ✅ 一个 HLS 或 FLV 拉流地址（观众观看用）…...