- c - 在位数组中找到第一个零
- linux - Unix 显示有关匹配两种模式之一的文件的信息
- 正则表达式替换多个文件
- linux - 隐藏来自 xtrace 的命令
对于 html:
<body>
<div>
<div>
<div>
...
</div>
</div>
</div>
</body>
有什么方法可以创建使用其父值的递归变量:
body > div {
--x: 1;
}
div {
--x: calc(var(--x) + 1);
}
以上内容无效,因为 css variables cannot have dependency cycles .另一个无效的例子:
body > div {
--is-even: 0;
--is-odd: 1;
}
div {
--is-even: var(--is-odd);
--is-odd: var(--is-even);
}
在css中有没有间接的方式来表达这样的递归变量?
最佳答案
您可以使用两个 CSS 变量来模拟递归行为并避免循环依赖。
这是一个例子:
body {
--x: 10;
}
.y {
--y: calc(var(--x) + 1);
}
.x{
--x: calc(var(--y) + 1);
}
.result {
border-right:calc(1px * var(--y)) solid red;
border-left:calc(1px * var(--x)) solid green;
height:50px;
}
<body>
<div class="y">
<div class="x">
<div class="y">
<div class="x">
<div class="y">
<div class="x">
<div class="y result">
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</body>
如果检查该元素,您会发现最后一个元素的 border-right 等于 17px (10 + 7
),border-left 等于 16px (10 + 6
)
这个想法非常适合具有 2 级结构的元素,例如列表:
body {
--x: 30;
}
ul {
font-size: calc(var(--x) * 1px);
--y: calc(var(--x) - 8);
}
li {
--x: calc(var(--y));
}
<ul>level A
<li>item 1
</li>
<li>item 2
<ul>level B
<li>item 2.1
<ul>level C
<li>item 2.1.1
</li>
<li>item 2.1.2
</li>
</ul>
</li>
<li>item 2.2
</li>
</ul>
</li>
</ul>
关于html - 递归变量可以用css表达吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/49973885/
我希望 Eclipse 调试器观察某个表达式何时变为真(其值发生变化)并在发生这种情况时停止。这在我看来非常有用和基本,所以我认为必须有一种方法可以在 eclipse 中做到这一点(如在 gdb 中)
我正在使用 SPEL 表达式,当我的应用程序启动时,我收到此错误。 ftpOutboundGateway.setRenameExpressionString("'/processed/headers[
我不是 visual studio 程序员,但我需要快速创建一个应用程序来显示图像并使用 slider 操纵它的高度和宽度。我已经完成了快速谷歌和所有关于使用 picturebox(picbox) 作
我在玩弄 Boost Xpressive,但遇到了以下代码片段的问题 #include #include #include using namespace std; using namespac
今年我一直在想,2022年我想做些什么,做哪方面的改变,这周末在家终于想到了! 2021 轻描淡写 年底就一直想对2021年写一篇总结的,起码不得写个千八百字,可是思来想去不知道怎么写,直到最后都没想
这个问题在这里已经有了答案: Italic greek letters / latex-style math in plot titles (2 个回答) 8年前关闭。 我应该怎么做才能让 R 在图例
有没有办法为 jade 模板错误提供自定义异常处理程序? 例如 // server.js app = express(); app.set('view engine', jade); app.loca
我需要了解使用路由在 Express 应用程序中流程的工作原理,我有这些路线 app.use(require('./routes/reportsRouter')); app.use(require('
在一条 route 我有这个: if (elements.length <= 0) { var msg = 'no elements found
完整的代码如下 - 很简单,我想添加、删除或更新帖子 - 当我自己做其中一件事时,它可以工作,但一起它会中断 我在 NodeJS MySQL 中搜索了很多我用它来查询数据库 var mysql = r
下面的CSS选择器有没有更优雅的写法? input:not([type="image"]):not([type="submit"]) 我想匹配所有不是 image 类型或 submit 类型的 HTM
当我尝试全局安装 express-generator 时,它说它成功了。我什至可以在我的全局应用程序列表中看到它但是当我尝试运行 express我遇到标题问题:zsh: command not fou
这不是一个很好的问题,但它是这样的: 我正在结合 DataFrame 的几列进行非常简单的计算,但前提是一列具有特定值。想法是: if df.x==1: df.y = df.y - df.a/
我有一个网站 -https://example.com- 调用 API -https://api.example.com-。该 API 是用 Express 编写的,其使用 CORS package允
当我使用 Express 框架时,我将“.html”文件放入文件夹 View 中,然后将“.js”和“.css”文件放入 public 中。当我运行我的应用程序时,我可以获得 js 和 css,但我无
有一个简单的应用程序 var express = require('express'); var http = require('http'); var path=require('path'); v
我正在构建一个基于express的REST API,我想在用户的请求中使用错误的HTTP动词时发出警告。 目前,我正在添加 app.all('/', (req, res) => { answe
对于用于在 connect/express 中对 session 数据进行加密散列的 key 长度有什么建议吗?我看到了从 60 多个字符串到规范的“键盘猫”的所有内容。 对于我的直接用例,我打算对整
Redis 的HDEL 的时间复杂度是O(N)(其中N 是要移除的字段数)。我有一个用例,其中字段必须为每个操作进行类型转换。我将如何表达新的时间复杂度? O(N*2)? 最佳答案 时间复杂度将相同:
我看到我可以像这样指定 gradle 依赖项: dependencies { compile 'com.fasterxml.jackson.core:jackson-annotations:2
我是一名优秀的程序员,十分优秀!