我尝试使用 bootstrap 4
:Root color property 但我得到错误 invalid property value
我还检查了 bootstrap 文档,但一无所获。
有人可以帮助我如何使用 bootstrap 4 :root property
检查下面我试图实现但失败的片段。
提前致谢
:root {
--blue: #007bff;
--indigo: #6610f2;
--purple: #6f42c1;
--pink: #e83e8c;
--red: #dc3545;
--orange: #fd7e14;
--yellow: #ffc107;
--green: #28a745;
--teal: #20c997;
--cyan: #17a2b8;
--white: #fff;
--gray: #6c757d;
--gray-dark: #343a40;
--primary: #007bff;
--secondary: #6c757d;
--success: #28a745;
--info: #17a2b8;
--warning: #ffc107;
--danger: #dc3545;
--light: #f8f9fa;
--dark: #343a40;
--breakpoint-xs: 0;
--breakpoint-sm: 576px;
--breakpoint-md: 768px;
--breakpoint-lg: 992px;
--breakpoint-xl: 1200px;
}
.frm-input:focus {
border-color: --yellow;
}
<div class="frm-row">
<input class="frm-input" type="text" name="email" placeholder="Email address">
</div>
最佳答案
这些是 CSS variables .使用 var(--..)
引用它们。在您的情况下,它将是:
.frm-input:focus {
border-color: var(--yellow);
}
演示:https://codeply.com/go/I2WpYQe8oG
另请注意:Netbeans 目前不支持 CSS 变量。 Netbeans show css variables as error
关于css - Bootstrap 4 :root color displays invalid property value,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52018347/