我无法在任何浏览器中使用CSS变量。我已经尝试过使用vscode和Codepen,但无法使用CSS变量。另外,我尝试过在Chrome浏览器中启用这些标志并重新启动笔记本电脑,但仍然无法正常工作。
这是代码:
* {
margin: 0;
padding: 0;
}
:root {
--color-primary: #f9ed69;
/*yellow color */
}
nav {
margin: 30px;
background-color: --color-primary;
}
<nav>
<ul class="navigation">
<li><a href="#">About</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">Contact</a></li>
</ul>
<div class="button">
<a class="btn-main" href="#">Sign Up</a>
</div>
</nav>
var()
在值中设置CSS变量时,您缺少该函数,请在此处查看有关CSS Vars的更多信息
:root {
--color-primary: #f9ed69; /*yellow color */
}
* {
margin: 0;
padding: 0;
}
nav {
margin: 30px;
background-color: var(--color-primary);
}
<nav>
<ul class="navigation">
<li><a href="#">About</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">Contact</a></li>
</ul>
<div class="button">
<a class="btn-main" href="#">Sign Up</a>
</div>
</nav>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句