Sobes.tech
Middle

Kako resetujete stilove u svojim projektima?

sobes.tech АИ

Одговор од АИ

Обично користим normalize.css као основу. Он уједначава стилове елемената и чини их предвидљивијим у свим прегледачима, уз очување корисних подразумеваних стилова.

// Пример дела normalize.css
html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}

body {
  margin: 0;
}

main {
  display: block;
}

Понекад додајем свој мали ресет или скуп основних стилова изнад normalize.css за специфичне задатке или за нуловање маргина и паддинга код одређених елемената.

// Додатни стилови
*,
*::before,
*::after {
  box-sizing: border-box; /* Олакшава рад са димензијама */
}

body {
  min-height: 100vh; /* Истежу тело на целу видљиву висину */
  scroll-behavior: smooth; /* Плаво скроловање до јаркова */
  text-rendering: optimizeSpeed; /* Предност даје брзини приказа */
}

a {
  text-decoration: none; /* Уклања подвуке са линкова */
  color: inherit; /* Линкови наследју боју текста */
}

ul,
ol {
  list-style: none; /* Уклања ознаке листе */
  padding: 0;
  margin: 0;
}

button,
input,
textarea,
select {
  font: inherit; /* Форми елементи наследју фонт од родитеља */
}

img {
  max-width: 100%; /* Слике не прелазе границе контејнера */
  display: block; /* Уклања простор испод inline-блок елемената */
}

Избор конкретног приступа зависи од захтева пројекта и коришћеног оквира. normalize.css је добар компромис између потпуног ресета и подразумеваних стилова.