Bootstrap mit eigener CSS mischen?
Eine Agentur wo ich anfangen möchte zu arbeiten, arbeiten mit Bootstrap. Jetzt hab ich mich da ein bisschen reingelesen, aber irgendwie kommt es mir so vor, als hätte es sehr beschränkte Möglichkeiten z.B. beschränkte Buttonfarben ect. Soll ich die Buttonfarbe dann im Bootstrap CSS ändern oder soll ich eine zusätzliche Klasse machen und die dann in meinem css stylen oder soll ich gar nicht bootstrap verwenden und gleich nur mein css heranziehen.
Wie weit soll ich Bootstrap CSS und meine CSS vermischen oder soll ich versuchen reine Bootstrap Seiten zu machen?
Ich bin dezent verwirrt ... Hoffe ihr habt Nachsicht mit mir ^^
3 Antworten
Versuche die Bootstrap Klassen zu überlagern wenn du Änderungen wünschst, nie direkt dem Bootstrap CSS arbeiten, sonst würdest du die Möglichkeiten zum Update verlieren, da durch ein Update deine Änderungen jedes mal wieder verloren gehen würden. :)
Bevor du mit einem Framework wie Bootstrap anfängst zu arbeiten, sollte erst einmal nötiges HTML und CSS Grundlagenwissen vorhanden sein. Wenn du das verinnerlicht hast und im Schlaf beherrschst, beantwortet sich deine frage von alleine. Um dem jetzt etwas zuvor zu kommen.
Eigene Formatierungen ausschließlich in einem eigenen Stylesheet notieren. Dafür zunächst die bootstrap.min.css im Kopfbereich (head) einfügen. Danach deine CSS verlinken. In deinem CSS kannst du dann die einzelnen Elemente durch neue oder weitere Eigenschaften und/oder Werte überschreiben.
Eleganter ist es allerdings via Precompressor. Wie es auch schon weed9er erwähnt hat. Die aktuelle Bootstrap Version basiert auf Less. Wurde jedoch auch nach Sass portiert. Die kommende 4er Version ist jedoch mit Sass gestrickt (gut so!).
All das sollte dich aber vorerst nicht interessieren. Lieber erst einmal mit den Basics anfangen und diese verinnerlichen, bevor es an die Workflow-Optimierung geht. Den es nützt dir nichts, wenn du alles nur so halb lernst und am ende nichts gescheites bei herum kommt.
LG medmonk
Geht das nur mir so oder gehören Agenturen die Bootstrap nutzen verboten? Ich mein das is nen Baukastensystem für Casual-Developer...naja abgesehen vom Grid. Das würde ich vielleicht auch nutzen, würde ich inuit-css nicht kennen :D
Verboten nicht, aber sicher einige Stunden nachsitzen (im Hochsommer versteh sich ;-) ) wären mehr als angebracht. Ich mein, ich habe nichts gegen Bootstrap, Foundation und Co. Alle ganz nett und so. Aber der Hype geht einem auf die Eier. Noch mehr nervt diese eins-zu-eins Adaption der Formatierung. Sei es das Burger-Icon (Was Bootstrap mit 5 Zeilen zusammenschustert, bekomm' ich mit einer hin ;-) ), cta's und Co.
Ich selber brauche kein Bootstrap. Im Gegenteil, schreibe sauberes (schlankes) Markup ohne perversen Klassensalat. Da lob' ick mir Bourbon samt Neat. Aktuell aber mein eigenes Grid-System in Sass stricke. Sowohl Box als auch Flex-Modell. Wahlweise mit minimalen Klassen im Markup oder gänzlich ohne. Naja, jedem das seine. Ich habe das für mich perfekte Waffenarsenal zusammen.
- Jade
- Sass (Compass und/oder Bourbon+Neat)
- Coffee
- Gulp
- Bower
- Terminal
Kurz um (m)ein »Development Badass-Dreamteam«. ;D Brackets und Atom als IDE alles abrunden. PHPStorm schon seit längerem vor sich hin schlummert und Staub ansetzt. ;)
Atom ist aber keine IDE ;) Und PHPStorm bzw Web Storm sind schon ganz nette Tools:D
Bourbon uns Neat sind echt ganz nett, allgemein der ganze SASS Workflow. Aber ich finde eigentlich Bootstrap als Frontend Framework echt großartig, für Web Apps halt, aber nicht für "normale" Websites
Atom ist aber keine IDE ;)
Jein, an sich ein simpler Editor. Mit zusätzlichen Extensions wird daraus aber eine vollwertige IDE. PHPStorm ist super, aber eben auch ein echtes Schwergewicht. Brackets und Atom reichen bei mir zu 90% aus. Vor allem liebe ich das schlanke GUI.
Aber ich finde eigentlich Bootstrap als Frontend Framework echt großartig
Ich habe ja auch nichts gegen Bootstrap und Co. Ich habe jedoch etwas gegen die Art, wie es von vielen eingesetzt wird. ;-) Wenn ich ein Framework nutzen möchte, sollte ich mich vorher auch damit ausreichend befasst haben. Vor allem wissen warum dieses oder jenes so oder so gelöst wurde. Damit genau das möglich ist, sollte man erst einmal an den Basics arbeiten. Vorher Finger weg. Aber das ist nur meine Meinung.
KEINE NACHSICHT!
Ist natürlich quatsch. Adde in den Head deiner Seite unterhalb von dem <link> für deine bootstrap.css einfach eine neue CSS datei. Willst du klassen verändert musst du die jeweilige klasse einfach nur neu definieren.
Eine hässliche Variante wäre noch die Flag !important (background-color: red !important;). Sollte man nicht machen.
Im Grunde nimmst du das Framework und baust damit eine Webseite. Danach nimmst du deine Eigene CSS und passt die Seite an.
Wenn du etwas aus der Masse hervorstechen willst, dann eigne dir SASS oder LESS an. Mit npm compilern oder nativen Compilern lässt sich damit sauberer CSS code schreiben.
Außerdem glaube ich nicht, dass eine Firma die mit dem Bootstrapframework arbeitet viel über BEM weiß. Das solltest du dir mal durchlesen. Durch SASS und LESS kannst du nämlich klassen mit @extend .class-name erweitern.
Ich hoffe ich konnte helfen. Ansonsten einfach nen Kommentar und ich antworte:
Außerdem glaube ich nicht, dass eine Firma die mit dem Bootstrapframework arbeitet viel über BEM weiß. Das solltest du dir mal durchlesen. Durch SASS und LESS kannst du nämlich klassen mit @extend .class-name erweitern.
Geschweige von SMACSS ;-) Nur noch so arbeite. Wobei ich mal behaupte, das es in vielen Agenturen noch ein Buch mit sieben Siegeln ist. Auch was Precompressor angeht. Ich liebe es! Ob groß, ob klein - ich hau in jedes Projekt Sass mit rein. CSS? Nein, danke!. Sass Syntax? Die »alte«, bin doch kenne Pussy ;-P
SASS kann ich schon seit ein paar Jahren, bin wirklich ein FAN von
soll ich dann den gleichen klassennamen nehmen und den dann in meiner CSS ansprechen und versuchen zu überschreiben? Oder eine zweite Klasse anlegen un die dann ansprechen ...