Middle
Kuidas te lähtestate oma projektides stiile?
sobes.tech AI
Vastus AI-lt
Tavaliselt kasutan normalize.css põhjana. See ühtlustab elementide stiile ja muudab need kõikides brauserites prognoositavamaks, säilitades samal ajal kasulikud vaikimisi stiilid.
// normalize.css osa näide
html {
line-height: 1.15; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
}
body {
margin: 0;
}
main {
display: block;
}
Mõnikord lisan oma väikese nullimise või põhistiilide komplekti normalize.css-i peale teatud ülesannete jaoks või et nullida mõnede elementide ääred ja padjad.
// Täiendavad stiilid
*,
*::before,
*::after {
box-sizing: border-box; /* Muudab mõõtmetega töötamise prognoositavamaks */
}
body {
min-height: 100vh; /* Venitab keha kogu nähtava kõrguseni */
scroll-behavior: smooth; /* sujuv kerimine ankru juurde */
text-rendering: optimizeSpeed; /* eelistab kiirust renderdamisel */
}
a {
text-decoration: none; /* eemaldab lingi allajoonimise */
color: inherit; /* lingid pärivad teksti värvi */
}
ul,
ol {
list-style: none; /* eemaldab loendi markerid */
padding: 0;
margin: 0;
}
button,
input,
textarea,
select {
font: inherit; /* vormielemendid pärivad fonti vanemalt */
}
img {
max-width: 100%; /* pildid ei ületa konteinerit */
display: block; /* eemaldab inline-block elementide all oleva tühiku */
}
Konkreetse lähenemise valik sõltub projekti nõuetest ja kasutatavast raamistikust. normalize.css on hea kompromiss täieliku nullimise ja vaikimisi stiilide vahel.