Swilo leswi cinca-cincaka swa CSS

Bootstrap yi katsa kwalomu ka khume-mbirhi wa swihlawulekisi swa ntolovelo swa CSS (swilo leswi cinca-cincaka) eka CSS ya yona leyi hlengeletiweke, na madzana man’wana lama nga endleleni ya ku antswisiwa ka ku cinca-cinca hi ku ya hi xiphemu xin’wana ni xin’wana. Leswi swi nyika mfikelelo wo olova eka mimpimo leyi tirhisiwaka ngopfu ku fana na mihlovo ya hina ya nhlokomhaka, tindhawu to tshoveka, na switachi swa fonto ya nkoka loko u tirha eka muhlahluvi wa browser ya wena, bokisi ra sava ra khodi, kumbe ku endla xikombiso hi ku angarhela.

Swihlawulekisi swa hina hinkwaswo swa ntolovelo swi rhangeriwile hibs- ku papalata ku lwisana na CSS ya munhu wa vunharhu.

Swilo leswi cinca-cincaka swa timitsu

Hi leswi swilo leswi cinca-cincaka leswi hi swi katsaka (lemuka leswaku the :rootya laveka) leswi nga ngheniwaka kun’wana ni kun’wana laha CSS ya Bootstrap yi layichiweke kona. Ti kumeka eka _root.scssfayili ya hina naswona ti katsiwile eka tifayela ta hina ta dist leti hlengeletiweke.

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

Swilo leswi cinca-cincaka swa xiphemu

Hi tlhela hi sungula ku tirhisa swihlawulekisi swa ntolovelo tanihi swilo leswi cinca-cincaka swa laha kaya swa swiphemu swo hambana-hambana. Hi ndlela leyi hi nga hunguta CSS ya hina leyi hlengeletiweke, hi tiyisisa leswaku switayele a swi dyi ndzhaka etindhawini to fana na matafula lama pfanganisiweke, na ku pfumelela ku tlhela hi xitayili xa xisekelo na ku andlala swiphemu swa Bootstrap endzhaku ka ku hlengeletiwa ka Sass.

Languta matsalwa ya hina ya tafula ku kuma vutivi byo karhi bya ndlela leyi hi tirhisaka swilo leswi cinca-cincaka swa CSS .

Hi tlhela hi tirhisa swilo leswi cinca-cincaka swa CSS eka tigridi ta hina hinkwato—ngopfu-ngopfu eka ti-gutter—na matirhiselo yo tala ya swiphemu lama taka enkarhini lowu taka.

Swikombiso

Swilo leswi cinca-cincaka swa CSS swi nyika ku cinca-cinca loku fanaka na swilo leswi cinca-cincaka swa Sass, kambe handle ka xilaveko xa ku hlengeletiwa swi nga si tirhisiwa eka xihlamusela-marito. Xikombiso, laha hi tlhela hi veka fonto ya pheji ya hina na switayele swa vuhlanganisi hi swilo leswi cinca-cincaka swa CSS.

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