Mis on CSS Reset?

CSS Reset on CSS reeglite kogum, mille eesmärk on määrata kõigile HTML elementidele ühtsed baasstiilid vaikimisi, ületades erinevused brauserite standardstiilides. See aitab tagada ennustatava ja brauseriteva web-lehtede kuvamise.

CSS Reset peamised eesmärgid:

• Eemalda või nulli standardmarginaalid (margin, padding) ja äärised.
• Nulli standardmõõtmed ja ridade vahed pealkirjadel, lõikudel jne.
• Ühtne loendite kujundus (ul, ol).
• Reset-stiilide rakendamine tabelitele, vormidele, piltidele ja teistele elementidele.

Näide põhitasemest CSS Reset:

/*
   CSS Reset: Nullib brauserite standardstiilid
   tagades ühtse baasvaate elementidele.
*/

*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box; /* Lisab padding ja border elemendi üldlaiusele/ kõrgusele */
}

body {
  line-height: 1.5;
  -webkit-font-smoothing: antialiased; /* Fondi sujuvus */
}

img, picture, video, canvas, svg {
  display: block; /* Eemaldab standardse vahe inline piltidel */
  max-width: 100%; /* Tagab, et pildid ei välju konteinerist välja */
}

input, button, textarea, select {
  font: inherit; /* Järeltulev font vanemelt elemendilt */
}

p, h1, h2, h3, h4, h5, h6 {
  overflow-wrap: break-word; /* Pikkade sõnade lõhkumine */
}

On erinevaid CSS Reset variante, näiteks Eric Meyeri Reset CSS või Normalize.css. Normalize.css säilitab kasulikud standardstiilid, muutes ainult need, mis põhjustavad ühilduvusprobleeme. Valik nende vahel sõltub projektist ja arendaja eelistustest.