如何在SASS中获取CSS属性的值?
我想存储属性的当前值以供以后使用。 jQuery 已经解决了这个问题。
问题是我使用 @mixin
在几个地方应用 CSS hack (合理阻止列表),我想恢复 .block 中的
(目前子元素中的所有文本都已折叠)。font-size
属性-列表*
不满意的解决方法:
- 将全局默认字体大小保存在单独的文件中,并将其传递给
@import
上的@mixin
。当然,在一般情况下,这与应用 mixin 的对象的字体大小不同。 - 每当更改字体大小时都保存并传递它。这会使所涉及的文件变得混乱,因为在几个不相关的文件中
@include
排版样式表并不是很优雅。 - 多使用 jQuery。
可能令人满意的解决方法:
- 对改变字体大小的第一个祖先使用更强的规则来覆盖字体大小。这可能很难确定。
I'd like to store the current value of a property for later use. It's already been solved for jQuery.
The issue is that I'm using a @mixin
to apply a CSS hack in several places (Justified Block List) and I'd like to restore the font-size
property in .block-list *
(currently all text in sub-elements is just collapsed).
Unsatisfactory workarounds:
- Save the global default font size in a separate file and pass it to the
@mixin
on@import
. This is of course in the general case not the same font size as the objects which the mixin is applied to. - Save the font size whenever you change it, and pass that. This tangles up the files involved, since it's not very elegant to
@include
the typography stylesheet in several otherwise unrelated files. - Use more jQuery.
Possibly satisfactory workarounds:
- Override the font size with a stronger rule on the first ancestor which changes it. This could be tricky to determine.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
在样式实际应用于文档之前,无法得知属性的计算值(这就是 jQuery 检查的内容)。在样式表语言中,除了初始值或您指定的值之外,没有“当前”值。
每当更改字体大小时都保存它,并传递它似乎是最好的,@BeauSmith 给出了一个很好的例子。此变体允许您将大小或回退传递给已定义的全局:
There's no way to tell the computed value of a property until the styles are actually applied to a document (that's what jQuery examines). In the stylesheet languages, there's no "current" value except the initial value or the value you specify.
Save the font size whenever you change it, and pass that seems best, and @BeauSmith has given a good example. This variant lets you pass a size or fallback to a defined global:
如果你有一个 mixin 对字体大小做了一些“hacky”的事情,那么你可能需要像你注意到的那样重置字体大小。我建议如下:
_config.sass
。在
_config.sass
中定义基本字体大小:在主 sass 文件顶部添加
@import _config.sass
(s).更新 mixin 以将字体大小重置为您的 $base-font-size:
<前><代码>@mixin foo
导航
font-size: 0 // 这是 hacky 部分
>李
font-size: $base-font-size // 重置字体大小
注意: 如果您使用的是 SCSS 语法,则需要更新此处的示例。
If you have a mixin which is doing something "hacky" with the font size, then you will probably need to reset the font size as you have noticed. I suggest the following:
_config.sass
.Define your base font-size in
_config.sass
:Add
@import _config.sass
at the top of your main sass file(s).Update the mixin to reset the font-size to your $base-font-size:
Note: If you are using the SCSS syntax, you'll need to update the examples here.