Guherbarên CSS

Bootstrap di CSS-ya xweya berhevkirî de dora du dehan taybetmendiyên xwerû yên CSS (guhêrbar) vedihewîne, bi dehan kesên din jî li ser rê ji bo xweşkirina xweşkirina li ser bingehek per-pêkvekê. Vana dema ku di çavdêriya geroka we de, sandboxek kodê, an prototîpkirina gelemperî dixebitin, gihîştina nirxên gelemperî yên wekî rengên meya me, xalên veqetandinê, û stûnên tîpên bingehîn hêsan peyda dikin.

Hemî taybetmendiyên meyên xwerû bi pêşgir têne pêve kirinbs- da ku ji nakokiyên bi CSS-ya partiya sêyemîn re nekevin.

Guherbarên root

Li vir guhêrbarên ku em tê de ne (bala xwe bidin ku :rootew hewce ye) ku dikarin li her cîhê ku CSS-ya Bootstrap-ê hatî barkirin werin gihîştin. Ew di _root.scsspelê me de cih digirin û di pelên me yên berhevkirî de cih digirin.

: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));
}

Guherbarên pêkhatî

Em di heman demê de dest bi karanîna taybetmendiyên xwerû wekî guhêrbarên herêmî ji bo pêkhateyên cihêreng dikin. Bi vî rengî em dikarin CSS-ya xweya berhevkirî kêm bikin, pê ewle bibin ku şêwaz li cîhên mîna tabloyên hêlînkirî ne mîras in, û destûr bidin ku hin nûvekirin û dirêjkirina pêkhateyên Bootstrap piştî berhevkirina Sass-ê bidin.

Ji bo hin têgihîştinê li ser ka em guhêrbarên CSS-ê çawa bikar tînin , li belgeya tabloya me binêre .

Em di heman demê de guhêrbarên CSS-ê li seranserê torên xwe bikar tînin - di serî de ji bo gemaran - ku di pêşerojê de bêtir karanîna pêkhateyan tê.

Examples

Guherbarên CSS guhêrbarên Sass nermbûnek wekhev peyda dikin, lê bêyî ku hewcedariya berhevkirinê hebe berî ku ji gerokê re were pêşkêş kirin. Mînakî, li vir em tîpên rûpela xwe û şêwazên girêdanê bi guhêrbarên CSS-ê ji nû ve saz dikin.

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