twitter-bootstrap
Dostosowywanie stylu Bootstrap na Twitterze
Szukaj…
Uwagi
Należy zauważyć, że należy wymienić nazwę custom.css po głównym bootstrap.css, w przeciwnym razie wartości custom.css nie zostaną faktycznie zaimplementowane.
Przesłanianie domyślnego CSS
Wszyscy uwielbiają pasek startowy na Twitterze , ale niektórym z nas nie podoba się domyślny projekt. Oto prosty przewodnik, jak rozpocząć dostosowywanie projektu boostrap. Boostrap Twitter po sklonowaniu zapewnia zestaw domyślnych plików css, które możemy zastąpić.
Plik css poczty, który musimy zastąpić, to boostrap.min.css
w katalogu boostrap/dist/css
.
Aby zastąpić domyślny projekt boostrap, wykonaj 2 proste kroki.
custom.css
plikcustom.css
(lub możesz nadać mu dowolną nazwę) i połącz go zcustom.css
index.html
<html> <head> <title>Customize Bootstrap</title> <link rel="stylesheet" type="text/css" href="path/to/bootstrap.min.css"> <!-- This mus be declared after the bootstrap.min.css --> <link rel="stylesheet" type="text/css" href="path/to/your/custom.css"> </head> <body> <!-- Do something --> </body> </html>
Zacznij dostosowywać. Na przykład chcemy zmienić kolor domyślnego przycisku. Jeśli chcesz użyć domyślnego stylu przycisku bootstrap, musisz dodać klasę
btn
do<button class="btn">Sample</button>
. Po prostu napisz następujący kod nacustom.css
..btn{ background-color:red; }
Powyższy kod wytworzy coś takiego.
Domyślna :
Zwyczaj :
Ta technika uratuje nas przed przepisaniem całych stylów przycisków, które zostały już napisane przez autorów boostrap. To również uratowało nas przed napisaniem własnej klasy css, która jest dla mnie mniej uciążliwa.