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

CSS值和单位

news 来源：原创 2025/8/3 1:54:55

CSS值和单位

CSS 中的值和单位是构建样式的基础，它们定义了属性的具体表现方式。值用于定义样式属性的具体取值，而单位用于指定这些值的度量方式。CSS中常用的值和单位如下：

1.长度单位
px : 像素，绝对单位
em : 相对于元素的字体大小
rem : 相对于根元素的字体大小
vw : 视窗宽度的百分比
vh : 视窗高度的百分比
% : 相对于父元素的百分比

2.百分比单位
% : 相对于父元素的百分比

3.颜色值
color name ：预定义的颜色名称
#RRGGBB ：十六进制颜色值
rgb(R G B) ： RGB颜色值
rgba(R G B A) ： RGB颜色值加上透明度

4.字体值
font-family ：字体名称
font-size ：字体大小
font-weight ：字体粗细

5.边框和间距值
border-width : 边框宽度
margin : 外边框
padding : 内边框

6.时间和动画值
s ：秒
ms : 毫秒
transition : 过渡效果

7.百分比值
% : 相对于父元素的百分比

8.枚举值
none : 表示没有值的情况

以上仅为常见示例，CSS还有许多其他值和单位。

以下是一个CSS中不同值和单位的使用：

<!DOCTYPE html>
<html>
<head><title>CSS值和单位示例</title> <!-- 修正标题标签 --><style>.box {width: 200px;height: 100px;background-color: #ff0000; /* 修正颜色值：#ffo00o → #ff0000 */margin: 20px;padding: 10px;font-size: 18px;border: 2px solid blue;transition: width 1s;} /* 添加闭合大括号 */</style>
</head>
<body><div class="box">This is a box</div>
</body>
</html>

CSS值和单位

CSS值和单位 CSS 中的值和单位是构建样式的基础，它们定义了属性的具体表现方式。值用于定义样式属性的具体取值，而单位用于指定这些值的度量方式。CSS中常用的值和单位如下： 1.长度单位 px : 像素，绝对单位 em : 相对于元素的字…...

编程日记 2025/8/3 1:54:55

Redis高级篇之I/O多路复用的引入解析

文章目录一、问题背景1. 高并发连接的管理2. 避免阻塞和延迟3. 减少上下文切换开销4. 高效的事件通知机制5. 简化编程模型6. 低延迟响应本章小节二、I/O多路复用高性能的本质1. 避免无意义的轮询：O(1) 事件检测2. 非阻塞 I/O 零拷贝：最大化 CPU 利用率…...

编程日记 2025/7/31 0:00:57

FTP协议命令和响应码

文章目录 📦 一、什么是 FTP 协议？🧾 二、FTP 常见命令（客户端发送）📡 三、FTP 响应码（服务端返回）📌 响应码分类（第一位）✅ 常见成功响应码&…...

编程日记 2025/7/28 18:18:54

在win上安装Ubuntu安装Anaconda(linx环境)

一，安装Ubuntu 1. 在 Microsoft 商城去下载Ubuntu(LTS:是长期维护的版本) 2.安装完之后启动程序，再重新打开一个黑窗口： wsl --list --verbose 3.关闭Ubuntu wsl --shutdown Ubuntu-22.04 WSL2 Ubuntu-20.04文件太占c盘空间，…...

编程日记 2025/8/3 1:53:07

【Elasticsearch入门到落地】11、RestClient初始化索引库

接上篇《10、初始化RestClient》上一篇我们已经完成了RestHighLevelClient的初始化工作，本篇将正式进入索引库的创建阶段。我们将使用Java代码来创建酒店数据的索引库。一、准备工作 1. 创建常量类首先，我们需要定义一个常量类来存放索引库的mappi…...

编程日记 2025/7/31 6:06:57

远程服务调用的一些注意事项

引言最近工作中，遇到了一些关于远程服务调用的问题，背景是调用三方接口获取某些特征数据，但由于调用出现了超时，导致业务本身的接口的可用行降低。因此整理一些远程服务调用时的注意事项，通过不同维度的考虑来提高系…...

编程日记 2025/7/28 7:39:54

QML 样式库

在 QML 中，样式库（或 UI 框架）用于快速构建一致且美观的界面。Qt/QML 本身不提供内置的完整样式库，但可以通过以下方式实现样式管理或使用第三方库。 1. Qt Quick Controls 2 样式系统 Qt Quick Controls 2 是官方提供的 UI 组件…...

编程日记 2025/7/30 10:34:20

[RHEL8] 指定rpm软件包的更高版本模块流

背景：挂载RHEL ISO使用kickstart安装操作系统，安装包未指定安装perl，但是安装完可以查到其版本，且安装的是ISO中多个版本中的最低版本。原因：（1）为什么没有装perl，perl -v可以看到版…...

编程日记 2025/7/30 8:40:36

使用Python可视化洛伦兹变换

引言大家好！今天我们将探讨一个非常有趣且重要的物理概念—洛伦兹变换。它是相对论的核心内容之一，描述了在高速运动下，时间、长度以及其他物理量是如何发生变化的。通过使用 Python 进行可视化，我们不仅可以更好地理解这个概念，还能感受到物理世界中的奇妙之处。什么…...

编程日记 2025/8/2 22:10:39

【二叉树专题】一道深入浅出的 DFS 题：求二叉树的直径（含通俗易懂讲解）

题目： 给你一棵二叉树的根节点，返回这棵树的直径。直径是任意两个节点路径中，最长的一条路径所经过的边数。比如下面这棵树： 1/ \2 3/ \ 4 5它的最长路径是：4 → 2 → 5 或者 4 → 2 → 1 → 3&#xff0c…...

编程日记 2025/7/28 18:18:25

考研系列-计算机网络-第三章、数据链路层

一、数据链路层的功能 1.知识点总结 2.习题总结...

编程日记 2025/7/28 18:18:22

医药采购系统平台第10天02：按药品分类的统计按供货商统计按医院统计统计数据的导出DWR的配置和应用

如果想要获取相关的源码，笔记，和相关工具，对项目需求的二次开发，可以关注我并私信！！！ 一按药品分类的统计实现 1 按药品分类统计的需求按药品统计：在指定时间段中采购量、采购金…...

编程日记 2025/7/28 5:34:16

Navicat、DataGrip、DBeaver在渲染 BOOLEAN 类型字段时的一种特殊“视觉风格”

文章目录前言✅ 为什么 Boolean 字段显示为 [ ]？✅ 如何验证实际数据类型？✅ 小结前言看到的 deleted: [ ] 并不是 Prisma 的问题，而是数据库客户端（如 Navicat、DataGrip、DBeaver）在渲染 BOOLEAN 类型字段时的一种…...

编程日记 2025/8/2 21:43:46

url: https://www.bilibili.com/video/BV1Z14y1Z7LJ?spm_id_from333.788.videopod.episodes&vd_source7a1a0bc74158c6993c7355c5490fc600&p2 别人的笔记 url: https://zhuanlan.zhihu.com/p/626966526 指导原则（Guidelines） 编写提示词有两个…...

编程日记 2025/7/28 18:18:12

VLC搭建本机的rtsp直播推流和拉流

媒体---流---捕获设备，选择摄像头，点击串流 x下一步选择rtsp，点击添加看到了端口，并设置路径： 选择Video -H 264 mp3(TS) 点击下一个， 点击流，就开始推流了拉流，观看端&#x…...

编程日记 2025/7/28 18:18:08

Rocky Linux 9.1 修改网卡和DNS

在 Rocky Linux 9.1 中修改网卡和 DNS 配置可以通过 NetworkManager 工具实现（推荐）或直接编辑配置文件。以下是两种方法的详细步骤：方法一：使用 nmcli 命令行工具（动态生效）查看当前网络连接nmcli connection show # 输出示例： # NAME UUID …...

编程日记 2025/7/27 18:25:05

Web前端：常用的布局属性

常见的布局方式有哪些？ float：浮动布局 position 定位布局 flex 弹性布局（display） table 表格布局（弃用） 一、HTML5 语义化布局标签这些标签本身不提供布局能力，但能增强页面结构…...

编程日记 2025/8/2 5:24:02

XSS学习2

一、客户端的Cookie 1. 无状态的影响无状态问题: HTTP协议的无状态特性导致每次请求都是独立的，无法保持会话。例如，在银行办理业务时，柜员不需要重复询问客户信息，但在计算机网络中，每次HTTP请求都需要重新认证用户…...

编程日记 2025/8/1 10:43:26

软件设计师/系统架构师---计算机网络

概要什么是计算机网络？ 计算机网络是指将多台计算机和其他设备通过通信线路互联，以便共享资源和信息的系统。计算机网络可以有不同的规模，从家庭网络到全球互联网。它们可以通过有线（如以太网）或无线（如W…...

编程日记 2025/8/3 1:46:42

Kubernetes(k8s)学习笔记(二)--k8s 集群安装

1、kubeadm kubeadm 是官方社区推出的一个用于快速部署 kubernetes 集群的工具。这个工具能通过两条指令完成一个 kubernetes 集群的部署： 1.1 创建一个 Master 节点$ kubeadm init 1.2 将一个 Node 节点加入到当前集群中$ kubeadm join <Master 节点的 IP 和…...

编程日记 2025/8/3 1:51:23

线性DP：最长上升子序列（子序列可不连续，子数组必须连续）

目录 Q1：简单遍历 Q2：变式（加大数据量） Q1：简单遍历 Dp问题状态表示 f(i,j) 集合所有以第i个数结尾的上升子序列集合-f(i,j)的值存的是什么序列长度最大值max- 状态计算 （其实质是集合的划分）…...

编程日记 2025/8/2 13:29:23

SpringBoot 基本原理

SpringBoot 为我们做的自动配置，确实方便快捷，但一直搞不明白它的内部启动原理，这次就来一步步解开 SpringBoot 的神秘面纱，让它不再神秘。目录 SpringBootApplication 背后的秘密 Configuration ComponentScan EnableAutoC…...

编程日记 2025/8/3 1:45:02

LeetCode第158题_用Read4读取N个字符 II

LeetCode 第158题：用Read4读取N个字符 II 题目描述给你一个文件，并且该文件只能通过给定的 read4 方法来读取，请实现一个方法来读取 n 个字符。 read4 方法： API read4 可以从文件中读取 4 个连续的字符，并且将它…...

编程日记 2025/8/3 1:49:27

webgl入门实例-矩阵在图形学中的作用

矩阵在图形学中扮演着核心角色，几乎所有图形变换、投影和空间转换都依赖矩阵运算来实现高效计算。以下是矩阵在图形学中的主要作用及具体应用： 1. 几何变换矩阵乘法可以高效表示物体的平移、旋转、缩放等基本变换，并通过矩阵连乘实现复合变…...

编程日记 2025/8/3 1:51:21

基于Matlab求解矩阵电容等效容值

1需求仿真测试8*10阶举证电容等效容值。 2模型搭建 2.1打开simscape 在打开simulink之后打开simscape库，Simscape库位置如下 2.2搭建模型在库中寻找需要的元件搭建电路。 2.2.1基本元件电阻电容电感等基础器件，搭建电路之后需要对其进行幅值&…...

编程日记 2025/8/3 1:32:08

铅酸电池充电器方案EG1253+EG4321

参考： 基于EG1253EG4321铅酸电池(48V20AH)三段式充电器屹晶微高性价比的电瓶车充电器方案——EG1253 电瓶电压 48V电瓶锂电池，其充满约为55V~56V，因此充电器输出电压为55V~56V； 若是48V铅酸电池，标称电压为48V&…...

编程日记 2025/7/30 16:51:36

每天学一个 Linux 命令（26）：less

可访问网站查看，视觉品味拉满： http://www.616vip.cn/26/index.html less 是 Linux 中一个强大的文件内容查看工具，用于分页显示文件内容，支持快速搜索、滚动浏览、跳转等操作。相比 more，less 功能更丰富且支持向前和向后翻页，适合查看大文件或日志。命令格式 les…...

编程日记 2025/7/28 18:17:29

【网络】数据链路层知识梳理

全是通俗易懂的讲解，如果你本节之前的知识都掌握清楚，那就速速来看我的笔记吧~ 自己写自己的八股！让未来的自己看懂！ （全文手敲，受益良多） 数据链路层我们来重新理解一下这个图：…...

编程日记 2025/8/1 16:02:48

2.2 BackgroundWorker的使用介绍

BackgroundWorker 是 .NET Framework 中一个简化异步操作的组件，它位于 System.ComponentModel 命名空间下。它为开发人员提供了一种简单的方式在后台执行耗时操作，同时保持与 UI 线程的交互主要属性以及任务如下： DoWork 事件：…...

编程日记 2025/7/27 14:04:30

Java从入门到“放弃”（精通）之旅——类和对象全面解析⑦

Java从入门到“放弃”（精通）之旅🚀——类和对象全面解析⑦ 一、面向对象初探 1.1 什么是面向对象？ Java是一门纯面向对象的语言(OOP)，在面向对象的世界里，一切皆为对象。面向对象是解决问题的一种思想&a…...

编程日记 2025/7/30 6:08:29

无回显RCE

在CTF和实战渗透中，不是每一个命令执行点都有回显，有时我们审了半天代码，却发现好不容易找到的命令执行没有回显，但是这并不代表这段代码不能被我们利用，在无回显的情况下也是可以利用的首先我们来写一个最简单的php…...

编程日记 2025/7/31 1:42:50

DQN在Gym的MountainCar环境的实现

DQN on MountainCar 引言在本次实验里，我构建了DQN和Dueling DQN，并在Gymnasium库的MountainCar环境中对它们展开测试。我通过调整训练任务的超参数，同时设计不同的奖励函数及其对应参数，致力于获取更优的训练效果。最后&#…...

编程日记 2025/7/31 1:17:24

typescript判断是否为空

1 判断数据类型 1.1 基础数据类型比如number，string，boolean，使用typeof，返回值是string类型： 例如： if("number" typeof(item)) {egret.log("item的类型是number"); } else if(&…...

编程日记 2025/7/28 18:17:14

JavaScript forEach介绍（JS forEach、JS for循环）

文章目录 JavaScript forEach 方法全面解析基本概念语法详解参数说明工作原理与其他循环方法的比较forEach vs for循环forEach vs map 实际应用场景DOM元素批量操作数据处理性能考量常见陷阱与解决方案无法中断循环异步操作问题高级技巧链式调用（不使用 forEach …...

编程日记 2025/8/1 19:44:09

C语言之图像文件的属性

🌟 嗨，我是LucianaiB！ 🌍 总有人间一两风，填我十万八千梦。 🚀 路漫漫其修远兮，吾将上下而求索。图像文件属性提取系统设计与实现目录设计题目设计内容系统分析总体设计详细设计程序实现…...

编程日记 2025/7/28 21:34:12

Java链表反转方法详解

一、理解链表结构假设链表节点定义为： class ListNode {int val;ListNode next;ListNode(int x) { val x; } } 二、迭代法反转链表核心思路逐步反转每个节点的指针方向，最终使整个链表反向。步骤拆解初始化三个指针： prev&#xf…...

编程日记 2025/7/31 7:53:53

lmm-r1开源程序是扩展 OpenRLHF 以支持 LMM RL 训练，用于在多模态任务上重现 DeepSeek-R1

一、软件介绍文末提供程序和源码下载学习 lmm-r1开源程序是扩展 OpenRLHF 以支持 LMM RL 训练，用于在多模态任务上重现 DeepSeek-R1。二、简介小型 3B 大型多模态模型（LMMs）由于参数容量有限以及将视觉感知与逻辑推理相结合的固有复杂性…...

编程日记 2025/7/29 20:35:44

Java学习笔记（数组，方法）

一，数组 1.数组初始化 1.1动态初始化格式：数据类型[] 数组名 new 数据类型[数组长度]; int[] arr new int[3]; // 定义长度为3的int数组，元素默认值为0 double[] scores new double[5]; // 长度5，元素默认0.0 String[…...

编程日记 2025/8/2 17:31:06

嵌入式---零点漂移（Zero Drift）

一、零点漂移的定义与本质零点漂移（简称“零漂”）指传感器在输入信号为零（或理论上应输出固定零值）时，输出信号随时间、温度、环境等因素变化而偏离初始零点的现象。核心特征：无输入时输出非零且缓慢变…...

编程日记 2025/7/28 21:34:04

健身房管理系统设计与实现(springboot+ssm+vue+mysql)含万字详细文档

健身房管理系统设计与实现(springbootssmvuemysql)含万字详细文档健身房管理系统是一个全面的解决方案，旨在帮助健身房高效管理日常运营。系统主要功能模块包括个人中心、会员管理、员工管理、会员卡管理、会员卡类型管理、教练信息管理、解聘管理、健身项目管理、…...

编程日记 2025/8/2 23:44:47

C语言if

一、题目引入如果从键盘输入58,则以下程序输出的结果是多少? 二、运行结果三、题目分析因为这道题中的多个if是并列结构所以只要条件满足都会执行这一题58满足所有的条件所以可以运行出来也就是说每个if里面的条件都满足所以都会打印出来而下面的这种情况就是 if e…...

编程日记 2025/7/31 7:11:48

XSS学习1之http回顾

1. HTTP的基本结构与工作流程 HTTP是一个请求-响应协议，基于客户端与服务器之间的交互。每次用户通过浏览器请求某个资源时，HTTP协议都会完成一系列的步骤。 HTTP请求： HTTP请求由以下几个部分构成： 请求行： 请求方…...

编程日记 2025/7/28 14:06:42

小迪抓包技术算法加密（6-9天）

抓包技术 https://blog.csdn.net/2301_81015455/article/details/147014382 算法加密入门（了解） 在实际测试中安全性高一些得采用得都是AES等高安全加密，遇到这种，放弃你啥都不知道测个毛啊,所以直接run!!! 大部分解密时碰撞式…...

编程日记 2025/8/1 17:35:08

Tkinter与ttk模块对比：构建现代 Python GUI 的进化之路

在 Python GUI 开发中，标准库 tkinter 及其子模块 ttk（Themed Tkinter）常被同时使用。本文通过功能对比和实际案例，简单介绍这两个模块的核心差异。 1. 区别 Tkinter：Python 标准 GUI 工具包（1994年集成&…...

编程日记 2025/7/28 21:33:55

【数据结构入门训练DAY-18】信息学奥赛一本通T1331-后缀表达式的值

文章目录前言一、题目二、解题思路总结前言本次训练内容： 栈的复习。栈模拟四则运算计算问题的练习。训练解题思维。一、题目从键盘读入一个后缀表达式（字符串），只含有0-9组成的运算数及加（）、减…...

编程日记 2025/7/28 21:33:53

时序预测 | Transformer-LSTM-SVM时间序列预测（Matlab完整源码和数据，适合基础小白研究）

时序预测 | Transformer-LSTM-SVM时间序列预测（Matlab完整源码和数据，适合基础小白研究） 目录时序预测 | Transformer-LSTM-SVM时间序列预测（Matlab完整源码和数据，适合基础小白研究）效果一览基本介绍代码…...

编程日记 2025/7/28 21:33:51

【HarmonyOS 5】makeObserved接口详解

【HarmonyOS 5】makeObserved接口详解一、makeObserved接口是什么？ makeObserved 接口（API version 12 起可用）用于将非观察数据转为可观察数据，适用于三方包类、Sendable 装饰的类、JSON.parse 返回的对象、collections.Array…...

编程日记 2025/7/31 20:04:35

色谱图QCPColorMap

一、QCPColorMap 概述 QCPColorMap 是 QCustomPlot 中用于绘制二维颜色图的类，可以将矩阵数据可视化为颜色图（热力图），支持自定义色标和插值方式。二、主要属性属性类型描述dataQCPColorMapData存储颜色图数据的对象interpol…...

编程日记 2025/8/2 16:20:10

【数据结构_12】二叉树（4）

一、二叉树的层序遍历思路：可以按照先序的方式来遍历这个树，递归的时候，给递归方法，加上辅助的参数，level表示当前层数，递归过程中，根据level的值，决定当前整个节点要放到哪个list中…...

编程日记 2025/8/2 16:47:06

HCIA-Datacom高阶：vlan、vlanif、单臂路由、静态路由、ospf综合实验

本实验拓扑图如下：实验包含 AR1、AR2、AR3 路由器，LSW1（三层交换机）、LSW2、LSW3 交换机，以及 PC1-4 和 Server1。AR1 与 LSW2 通过单臂路由连接，AR2 与 AR3、LSW1 构成 OSPF 网络，AR1 与 AR2 间…...

编程日记 2025/7/31 12:01:56

CSS值和单位

相关文章：