.panel-默认边框颜色

Question

我有一个bootstrap默认面板：

<div class="panel panel-default">
    <div class="panel-heading">Login</div>
    <div class="panel-body">
    ...

我想删除边框，但不想使用其他类或ID等。

检查chrome中的元素我看到了：

.panel-default {
    border-color: #ddd;
}

这是如何分配这个值的。 据我所知，我可以通过相同的css选择器应用（至少）新值来覆盖css值。我的css文件是在bootstrap文件之后导入的。

我试过了：

.panel-default {
    border-color: none;
}

不起作用，但如果我使用：

.panel-default {
    border: none;
}

这有效。

因此none border-color不是可接受的值？或者它可能是什么样的黑客？因为如果我从Chrome的inspect element功能中分配任何一个，它就可以工作。

Answer 1

是none不是border-color的有效值，因此您必须使用border: none将其删除，或border-color: transparent如果您想保留边框，它看不见。

它适用于chrome devtools的原因是，chrome不会应用border-color: none等无效样式，如果您要更改元素的原始样式，则会删除该样式。