CSS3中的var()函数

news2025/2/13 14:39:22

目录

定义:

语法:

用法:


定义:

var()函数是一个 CSS 函数用于插入自定义属性(有时也被称为“CSS 变量”)的值

语法:

var(custom-property-name, value)

函数的第一个参数是要替换的自定义属性的名称。函数的第二个参数是可选的,用作回退值。如果第一个参数引用的自定义属性无效,则该函数将使用第二个值。

备注: 自定义属性的回退值允许使用逗号。例如,var(--foo, red, blue) 将 red, blue 同时指定为回退值;即是说任何在第一个逗号之后到函数结尾前的值都会被考虑为回退值。

用法:

:root {
  --main-bg-color: pink;
}

body {
  background-color: var(--main-bg-color);
}

<custom-property-name> 自定义属性名

在实际应用中它被定义为以两个破折号开始的任何有效标识符。自定义属性仅供作者和用户使用; CSS 将永远不会给他们超出这里表达的意义。

<declaration-value> 声明值(回退值)

回退值被用来在自定义属性值无效的情况下保证函数有值。回退值可以包含任何字符,但是部分有特殊含义的字符除外,例如换行符、不匹配的右括号(如 )] 或 })、感叹号以及顶层分号(不被任何非 var() 的括号包裹的分号,例如 var(--bg-color, --bs;color) 是不合法的,而 var(--bg-color, --value(bs;color)) 是合法的)。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/863974.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

【网络编程·传输层】UDP和TCP的经典八股文

目录 一、端口号划分 二、部分指令 1、pidof&#xff08;用于查看进程id&#xff09; 2、netstat&#xff08;查看网络状态&#xff09; 三、UDP协议 1、UDP协议格式 2、UDP协议如何进行封装、解包、分用 2.1封装、解包 2.2分用 3、UDP协议的特点 3.1UDP协议的特点 …

关于接口自动化,你不能不知道的高级技巧——接口自动化神器apin进阶操作

一、变量提取和引用 变量提取和引用主要是为了解决接口之间的参数依赖问题。 使用场景&#xff1a;接口 A 的参数中需要使用接口 B 返回的某个数据&#xff0c;那么就要在请求 B 接口之后&#xff0c;提取数据保存&#xff0c;给请求 A 接口时使用。 1、变量提取 在用例集或…

AST入门与实战(三):if节点转switch节点(瑞数5)

原文地址:https://zhuoyue360.com/jsnx/110.html 1. 期望 这是一个瑞数5代解混淆的案例&#xff0c;我们本章节需要做的是把if节点的内容转换成switch-case内容.以此来熟悉AST对JS混淆的对抗. 原始代码: function whileState() {while (1) {aV cA[wU];if (aV < 4) {if (…

metaRTC7 demo mac/ios编译指南

概要 metaRTC7.0开始全面支持mac/ios操作系统&#xff0c;新版本7.0.023 mac os demo 包含有srs/zlm的推拉流演示。发布版自带了x64版第三方类库&#xff0c;arm版第三方类库还需开发者自己编译。 源码下载 下载文件metartc7.023.7z https://github.com/metartc/metaRTC/re…

远程桌面弱口令攻击:网络安全的顽疾与挑战

导语&#xff1a; 随着远程办公和云技术的普及&#xff0c;远程桌面弱口令攻击成为了网络安全的顽疾。本文将深入探讨弱口令攻击的原理、危害以及有效的防范措施&#xff0c;帮助读者提升远程桌面安全性。 第一部分&#xff1a;弱口令攻击的原理与方法 1.1 什么是远程桌面弱口…

页面的滚动及scrollIntoView的穿透效果和解决

朋友今天遇到一个奇怪的问题&#xff0c;我觉得很有意思就记录一下。现象是这样的&#xff0c;页面有一个按钮&#xff0c;点击按钮以后会请求一个接口拿到一个iframe的地址然后创建一个iframe并渲染到页面上&#xff0c;iframe的页面加载完毕后会滑动到对应的某一个元素的位置…

统一门户|WorkPlus整合内部应用,构筑企业统一的智能工作入口

国家“十四五”发展规划中指出加强数字化发展&#xff0c;支持企业建设一体化数字平台&#xff0c;全面整合企业内部系统&#xff0c;提升产业链上下游协同效率。而在数字化经济浪潮下&#xff0c;企业和各类组织随着业务规模、人员规模的不断扩大&#xff0c;在信息化办公中存…

一次暴露面全开的红帽渗透测试【getshell】

0x01、信息收集阶段 注&#xff1a;本次信息收集过程主要使用FOFA网络探测平台 https://fofa.info/ 一开始进行收集的时候&#xff0c;有点迷&#xff0c;直接进行了大面积的"gov.in"域名收集 host"gov.in" && country"IN" 哈哈68465…

buuctf crypto刷题1

目录 (1) 凯撒&#xff1f;替换&#xff1f;呵呵!(替换密码爆破) (2) RSA1(dp泄露) (3) RSA2(dp泄露大整数分解) (4) RSA3(共模攻击) (5) 还原大师(md5爆破) (6) RSA(公钥文件解析) (7) RsaRoll (8) Dangerous RSA(小明文攻击) (9) [GUET-CTF2019]BabyRSA (10) [BJD…

成集云 | 聚水潭售后申请单同步伙伴云 | 解决方案

方案介绍 聚水潭是一款电商平台&#xff0c;提供售后申请功能帮助用户解决购物过程中遇到的问题&#xff0c;售后申请功能为用户提供了便利的售后服务&#xff0c;并促进用户与商家或卖家之间的沟通和协商。用户可以在聚水潭平台上轻松提交售后申请&#xff0c;并随时查看处理…

『赠书活动 | 第十七期』《Python网络爬虫:从入门到实战》

&#x1f497;wei_shuo的个人主页 &#x1f4ab;wei_shuo的学习社区 &#x1f310;Hello World &#xff01; 『赠书活动 &#xff5c; 第十七期』 本期书籍&#xff1a;《Python网络爬虫&#xff1a;从入门到实战》 赠书规则&#xff1a;评论区&#xff1a;点赞&#xff5c;收…

国内唯一!腾讯零信任iOA入选全球UEM厂商全景图

近日&#xff0c;国际权威机构Forrester发布《The Unified Endpoint Management Landscape, Q3 2023》&#xff08;以下简称“报告”&#xff09;&#xff0c;对全球24家统一终端管理厂商进行了综合性评估&#xff0c;腾讯安全凭借零信任iOA在DEX&#xff08;数字化员工体验&am…

烂尾30年的楼盘,变身高端豪宅,龙华又多一供应

近日&#xff0c;深圳市规划和自然资源局龙华管理局发布了恒地尊悦花园&#xff08;A807-0632&#xff09;建设工程规划许可证的通告。恒地尊悦花园位于龙华区民治街道民荣北路与民通路交果东侧&#xff0c;项目地块实际上就是烂尾了近30年的福罗拉山庄别墅区。 根据规划&#…

基于大模型的数据血缘异常归因分析

近日&#xff0c;以“元数据技术及应用创新”为主题&#xff0c;最新一季StartDT Hackathon&#xff08;奇点云黑客马拉松&#xff09;正式收官。 本期黑客松共吸引了近50位选手参赛&#xff0c;有的在实时数仓领域显神通&#xff0c;有的则再次请出了大模型。这些小组都有个共…

图像多目标跟踪

目标跟踪&#xff08;Object Tracking&#xff09;是自动驾驶中常见的任务&#xff0c;根据跟踪目标数量的不同&#xff0c;目标跟踪可分为&#xff1a; 单目标跟踪&#xff08;Single Object Tracking&#xff0c;SOT&#xff09;多目标跟踪&#xff08;Multi-Objects Tracki…

推特群推王构建你的流量池

随着社交媒体的兴起&#xff0c;推特已成为了一个信息传播、交流、互动的重要平台。在这个充满了各种声音和观点的数字世界里&#xff0c;如何有效地将自己的声音传达出去&#xff0c;吸引更多的关注和互动&#xff0c;已经成为了一个备受关注的话题。而在这个过程中&#xff0…

浏览器渲染进程的线程有哪些

浏览器的渲染进程的线程 GUI 渲染线程 GUI 渲染线程是在 GUI 应用程序中负责界面渲染的线程。负责渲染浏览器页面&#xff0c;解析 HTML、CSS&#xff0c;构建DOM 树、构建CSSOM树、构建渲染树和绘制页面&#xff1b;当界面需要重绘或由于某种操作引发回流时&#xff0c;该线程…

Scratch 之 如何矢量图中去除矢量刺

如果您曾经在“矢量编辑器”中使用过轮廓&#xff0c;那么您一定已经看到了这一点... 这被称为矢量刺&#xff0c;只有当你正在绘制的形状中有尖锐的点或角时才会发生这种情况&#xff0c;这真的很烦人&#x1f621; 所以在这个视频中&#xff0c;我将向你展示如何摆脱这些令人…

Byzer-LLM环境安装

1.Byzer-LLM简介 Byzer-LLM 是基于 Byzer 的一个扩展&#xff0c;让用户可以端到端的完成业务数据获取&#xff0c;处理&#xff0c;finetune大模型&#xff0c;多场景部署大模型等全流程。 该扩展的目标也是为了让企业更好的将业务数据注入到私有大模型&#xff08;开源或者商…

9.2.1Socket(UDP)

一.传输层: 1.UDP:无连接,不可靠,面向数据报,全双工. 2.TCP:有连接,可靠,面向字节流,全双工. 注意:这里的可不可靠是相对的,并且和安不安全无关. 二.UDP数据报套接字编程: 1.socket文件:表示网卡的这类文件. 2.DatagramPacket:表示一个UDP数据报. 三.代码实现: 1.回显服务…