2017-04-12 5 views
0

Wie kann ich Bootsrap Stil wie Körper Hintergrundfarbe bearbeiten?So bearbeiten Sie Bootstrap-Stile?

ich nicht die ganze Zeit tun wollen:

body { background: #539754 !important; } 

I Schriftfarbe in navbar setzen wollen, aber ich kann das nicht tun. Ich bin preety verwirrt darüber, wo die Stile von

.navbar-default .navbar-nav > li > a { 
color: #000; 
font-size: 20px; 
font-family: cursive; 
} 
.navbar-default .navbar-nav > li > a:hover, 
.navbar-default .navbar-nav > li > a:focus { 
color: #333; 
background-color: transparent; 
} 

kommen, ich habe diese innerhalb bootstrap.css aber nichts geschah. Wenn Sie F12 drücken, bearbeiten Sie es dort in der Datei /dist/css/bootstrap.css - ich habe nicht einmal diesen Ordner. Ich verstehe seine dynamisch erstellt aber wie kann ich es bearbeiten?

+0

Sie besser nicht Bootstrap CSS bearbeiten, aber Ihre eigene CSS schreiben und die Regeln gelten Sie –

+0

So ist die gängige Praxis möchte ist, dass Stil zu nehmen ich brauche, und es überschreiben? mit! wichtig? oder erstellen Sie völlig neue Stilklasse/-bezeichner – dtechlearn

+1

Sie sollten im Allgemeinen nur wichtig als letzten Ausweg verwenden, und selbst dann ist es wahrscheinlich kein letzter Ausweg und Sie sollten es nicht benutzen. Wie die andere Person sagte. Sie können Ihrem HTML-Element einen Klassenselektor hinzufügen und dann Ihre Stile auf diese Weise anwenden. Sie können Ihr CSS spezifischer schreiben, um Bootstraps ect zu überschreiben. ect. – camccar

Antwort

1

Um Bootstrap-Arten außer Kraft setzen Sie Ihr eigenes Stylesheet wie styles.css erstellen und sicher sein, um es nach der CSS-Bootstrap-Datei zu laden. Wenn Sie die Klassen definieren, stimmen Sie einfach mit der Bootstrap-Struktur überein oder überschreiten Sie sie. Beispiel: Wenn Bootstrap definiert:

.navbar-default .navbar-nav > li > a { 
    color: #000; 
    font-size: 20px; 
    font-family: cursive; 
} 

und alles, was Sie tun möchten, ist Farbe ändern, die Sie dies zu Ihrem neuen Stylesheet hinzufügen.

.navbar-default .navbar-nav > li > a { 
    color: #CC0000; 
} 
1

eine Klasse zu Ihrem <li> Tag wie

hinzufügen
class="diff-color" 

Dann Regeln zu Ihrer CSS-Datei hinzufügen

.diff-color{ 
    color:blue; 
} 
+0

Das funktioniert in einigen Fällen, aber manchmal möchten Sie einfach viele Standardkomponenten durchgehen und neu definieren. – Adrianopolis

Verwandte Themen