@supports CSS at-rule 不能正常工作 [英] The @supports CSS at-rule is not working properly
问题描述
在 iOs 设备中 background-attachment: fixed;
不起作用,所以我通过使用 @supports
CSS 规则找到了解决方法.
In iOs devices background-attachment: fixed;
does not work so i found a work around by using @supports
CSS rule.
它在 testground 站点中正常工作,但是当我尝试将其应用于主站点 css 时,它不起作用.
It worked properly in the testground site but when i tried to apply it to the main site css it didnt work.
在 testground 站点中,我通过以下方式将其直接应用到 中:
In the testground site i applied it directly into the <head>
the following way:
<style>
.paral2 {
min-height: 300px;
background-attachment: fixed;
background-size: auto;
background-position: center;
background-repeat: no-repeat;
}
@supports (-webkit-touch-callout: none) {
.paral2 {
min-height: 300px;
background-attachment: scroll;
background-size: auto;
background-position: center;
background-repeat: no-repeat;
}
}
</style>
但是在主站点中,我必须使用(根据客户要求)style.css
文件,所以我这样应用它:
But in the main site i had to use (per client requirement) the style.css
file and so i applied it like this:
@supports (-webkit-touch-callout: none) {
.paral {
min-height: 300px;
background-attachment: scroll;
background-size: auto;
background-position: center;
background-repeat: no-repeat;
}
}
.paral {
min-height: 300px;
background-attachment: fixed;
background-size: auto;
background-position: center;
background-repeat: no-repeat;
}
它不起作用,我不知道为什么,我完全迷失了.
And it doesnt work, i got no idea why, im completely lost.
可能是相关的,在 style.css
文件中,@supports
规则及其以下元素看起来很奇怪,见下图:
Might be relevant, in the style.css
file the @supports
rule and its following elements look weird see the below picture:
只有 .paral
类中的第一个元素被着色为黄色.
Only the first element inside the .paral
class gets colored in yellow.
任何形式的帮助将不胜感激,并一如既往地提前致谢.
Any kind of help would be greatly appreciated and as always thanks in advance.
推荐答案
事实证明 @support
规则运行良好 问题是清除手机的缓存,如果我没有清除整个历史记录手机的变化从未完全应用,我觉得很傻,但至少它得到了解决.
Turns out the @support
rule was working perfectly the issue was clearing the cache of the phones, if i didnt clear the whole history of the phone the changes never fully applied, i feel silly but at least it got solved.
这篇关于@supports CSS at-rule 不能正常工作的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!