.panel-Standardrahmenfarbe

Question

Ich habe eine Bootstrap-Standardplatte:

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

ich entfernen möchte die Grenze, aber nicht wollen, zusätzliche Klasse oder ID verwenden, etc ..

Inspizieren Elemente in chrome sehe ich:

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

So wurde dieser Wert zugewiesen. Wie ich weiß, kann ich css Werte überschreiben, indem ich (mindestens) neue Werte durch selbe css selectors anwende. Meine CSS-Datei wird nach der Bootstrap-Datei importiert.

Ich habe versucht:

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

nicht funktioniert, aber wenn ich benutze:

.panel-default { 
    border: none; 
} 

das funktioniert.

Also none ist kein akzeptabler Wert für border-color? oder was für ein Hack könnte es sein? denn wenn ich keine von inspect element Feature von Chrome zuweisen funktioniert es.

Answer 1

Ja none ist kein gültiger Wert von border-color, so haben Sie border: none, es zu benutzen oder border-color: transparent zu entfernen, wenn Sie die Grenze halten wollen, aber es unsichtbar machen.

Der Grund, warum es für Chrome Devtools funktioniert, ist, dass Chrome keine ungültigen Stile wie border-color: none anwendet und wenn Sie den ursprünglichen Stil Ihres Elements ändern, wird der Stil entfernt.