CSS ƒe tɔtrɔwo

Bootstrap de CSS ƒe nɔnɔme tɔxɛ siwo ade blaeve vɔ eve (trɔtrɔwo) ɖe eƒe CSS si woƒo ƒu me, kple bla nane bubuwo le mɔ dzi hena tɔtrɔwɔwɔ si nyo wu le akpa ɖesiaɖe ƒe gɔmeɖoanyi dzi. Esiawo naa mɔnukpɔkpɔ bɔbɔe be nàkpɔ asixɔxɔ siwo wozãna zi geɖe abe míaƒe tanya ƒe amadedewo, breakpoints, kple ŋɔŋlɔdzesi gbãtɔwo ƒe ƒuƒoƒo ne èle dɔ wɔm le wò web-browser ƒe inspector, code sandbox, alo general prototyping me.

Wotsɔa míaƒe nɔnɔme tɔxɛwo katã doa ŋgɔ nabs- be míaƒo asa na masɔmasɔ kple ame etɔ̃lia ƒe CSS.

Ke ƒe tɔtrɔwo

Trɔtrɔ siwo míetsɔ de eme (de dzesii be the :rootis required) siwo woateŋu akpɔ le afisiafi si Bootstrap ƒe CSS la le lae nye esi. Wole míaƒe _root.scssfaɛl me eye wole míaƒe dist faɛl siwo míeƒo ƒu la me.

:root {
  --bs-blue: #0d6efd;
  --bs-indigo: #6610f2;
  --bs-purple: #6f42c1;
  --bs-pink: #d63384;
  --bs-red: #dc3545;
  --bs-orange: #fd7e14;
  --bs-yellow: #ffc107;
  --bs-green: #198754;
  --bs-teal: #20c997;
  --bs-cyan: #0dcaf0;
  --bs-white: #fff;
  --bs-gray: #6c757d;
  --bs-gray-dark: #343a40;
  --bs-primary: #0d6efd;
  --bs-secondary: #6c757d;
  --bs-success: #198754;
  --bs-info: #0dcaf0;
  --bs-warning: #ffc107;
  --bs-danger: #dc3545;
  --bs-light: #f8f9fa;
  --bs-dark: #212529;
  --bs-font-sans-serif: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "Liberation Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
  --bs-font-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;
  --bs-gradient: linear-gradient(180deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0));
}

Kpeɖeŋutɔ ƒe tɔtrɔwo

Míele egɔme dzem hã be míazã nɔnɔme tɔxɛwo abe teƒea ƒe tɔtrɔwo na akpa vovovowo ene. Mɔ sia dzi míate ŋu aɖe míaƒe CSS si míeƒo ƒu la dzi akpɔtɔ, akpɔ egbɔ be womexɔ atsyãwo ƒe dome le teƒewo abe kplɔ̃ siwo wotsɔ ƒo ƒui ene o, eye míaɖe mɔ ɖe Bootstrap ƒe akpawo ƒe tɔtrɔ kple kekeɖenu vevi aɖewo ŋu le Sass ƒe nuƒoƒoƒu vɔ megbe.

Lé ŋku ɖe míaƒe kplɔ̃dzi nuŋlɔɖiwo ŋu hena gɔmesese aɖewo le alesi míele CSS tɔtrɔwo zãm ŋu .

Míele CSS ƒe tɔtrɔwo hã zãm le míaƒe grids katã me—vevietɔ na gutters—kple akpa geɖe zazã le etsɔme.

Kpɔɖeŋuwo

CSS ƒe tɔtrɔwo naa asitɔtrɔ le nɔnɔmewo ŋu abe Sass ƒe tɔtrɔwo ene, gake mehiã be woaƒo wo nu ƒu hafi atsɔ wo ana web-browser la o. Le kpɔɖeŋu me, afisia míele míaƒe axaa ƒe nuŋɔŋlɔ kple kadodo ƒe atsyãwo gbugbɔ ɖom kple CSS tɔtrɔwo.

body {
  font: 1rem/1.5 var(--bs-font-sans-serif);
}
a {
  color: var(--bs-blue);
}