【问题标题】:Use part of class name as a css variable使用类名的一部分作为 css 变量
【发布时间】:2014-07-22 20:14:48
【问题描述】:

我正在使用 css 来更改两个 div 的大小,以便它们的大小代表每个会话更改几次的某个值。

有没有办法定义一个类似的css类:

.shiftydiv(*) {
    width:\1;
}

\1 在哪里匹配 * ?然后我可以在需要更改大小时通过 jquery 添加一个像 .shiftydiv25 这样的类。

我不需要对浏览器的旧版支持,我不希望添加任何依赖项。 如果我不能用纯 css 做到这一点,我要么动态创建 CSS 类,要么将style= 属性注入我的代码。哪个会更好(不那么糟糕)。

编辑: 如果有一个很好的方法可以用 JS/jquery 来做这件事,那也很好。

编辑 2: 所以用js做这个其实很简单。哎呀

【问题讨论】:

  • 不,没有办法用 CSS 做到这一点,那么你想用 javascript 做到这一点,因为你已经标记了这个问题吗?
  • 您正在使用 jQuery 设置类 - 为什么不使用它设置宽度?
  • 其实你已经成为x/y problem的牺牲品,你应该用jQuery设置样式
  • 听起来你需要JQuery的.css()方法
  • 不要“注入”或修改样式属性。使用 JS .style 或 jQuery .css()。例如:`$('.shifty').css('width','2px')。另请记住,您可以通过媒体查询和使用百分比而不是像素来做很多事情。

标签: javascript css wildcard


【解决方案1】:

也许纯 CSS 使用 SASS/LESS 并生成多个类?

您可以使用 for loop 并迭代假设 20 个元素并制作 .shiftydiv1、shiftydiv2、... shiftydiv20。

【讨论】:

  • 对于CSS 文件来说,这是一个巨大的膨胀。绝对不推荐。
猜你喜欢
  • 2013-09-04
  • 1970-01-01
  • 1970-01-01
  • 2014-10-31
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2019-11-06
  • 2015-02-04
相关资源
最近更新 更多