如何将参数传递给CSS类

要求莫斯塔法

我想知道是否可以通过以下方式为CSS添加一些灵活性:

<div class='round5'></div>

其中.round是一个带有圆角的类,“ 5”确定半径的大小。可能吗?我已经看到了一些地方,但是我不知道实现是如何发生的。

斯特维兹

对于在2018年陷入困境的任何人,虽然没有完全支持的CSS变量现在使您能够将变量直接传递到类中。

<div class="round" style="--radius: 100%;"></div>
<style>
  .round {
    display: block;
    height: 40px;
    width: 40px;
    border: 1px solid #BADA55;
    border-radius: var(--radius);
  }
</style>

您还可以定义根变量并将其传递给

<div class="round" style="--radius: var(--rad-50);"></div>
<style>
  :root {
    --rad-0: 0%;
    --rad-50: 50%;
    --rad-100: 100%;
  }
  .round {
    display: block;
    height: 40px;
    width: 40px;
    border: 1px solid #BADA55;
    border-radius: var(--radius);
  }
</style>

这也适用于该元素。如果--radius在一个元素中设置in,则不会影响另一个元素。爵士乐吧!

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何将参数传递给CSS类

来自分类Dev

如何将参数传递给静态类构造函数?

来自分类Dev

如何将参数传递给webapi中的数组类?

来自分类Dev

如何将变量参数传递给基类

来自分类Dev

如何将类模板参数传递给boost :: variant?

来自分类Dev

VB.NET如何将参数传递给类?

来自分类Dev

如何将类作为可选参数传递给方法?

来自分类Dev

如何将参数传递给使用模板的类

来自分类Dev

如何将QWidget参数传递给类

来自分类Dev

如何将参数传递给类中的__init__

来自分类Dev

如何将参数传递给类中的装饰器

来自分类Dev

如何将lambda传递给需要类参数的函数

来自分类Dev

如何将模板类的名称传递给模板参数?

来自分类Dev

如何将参数传递给超类?

来自分类Dev

如何将参数传递给 Django 中的表单类?

来自分类Dev

如何将js参数传递给CSS样式

来自分类Dev

如何将参数传递给片段?

来自分类Dev

如何将参数传递给线程?

来自分类Dev

如何将参数传递给ValidationAttribute?

来自分类Dev

如何将参数传递给BootstrapperFile?

来自分类Dev

如何将参数传递给jvmmon?

来自分类Dev

如何将参数传递给exe?

来自分类Dev

如何将参数传递给嵌入

来自分类Dev

如何将参数传递给sed?

来自分类Dev

如何将参数传递给BootstrapperFile?

来自分类Dev

如何将参数传递给别名?

来自分类Dev

如何将参数传递给jvmmon?

来自分类Dev

如何将参数传递给ElapsedEventHandler

来自分类Dev

如何将参数传递给boilermake