İstifadəçi agenti stilləri nədir və onlarla işləmək…

İstifadəçi agenti stilləri, brauzerlərin HTML elementlərinə tətbiq etdiyi standart CSS stilləridir və müəllif və ya istifadəçi stil cədvəlləri yüklənmədən əvvəl tətbiq olunur. Bu stillər elementlərin əsas görünüşünü təmin edir (məsələn, paraqraflardakı boşluqlar, <strong> içində qalın mətn).

Onlarla aşağıdakı üsullarla işləmək mümkündür:

Stilərin üst-üstə qoyulması: Müəllifin daha yüksək spesifikliyi olan və ya CSS kodunda sonra yerləşən stillər istifadəçi agenti stillərini üstələyir.
```
p {
  margin: 0; /* Standart margin-i üstələyir */
}
```

CSS Reset və ya Normalize.css istifadə etmək: Bu kitabxanalar elementlərin əsas stillərini sıfırlayır və ya vahidləşdirir, brauzerlər arasında istifadəçi agenti stilləri arasındakı fərqləri neytrallaşdırır.

Reset CSS: Əksər istifadəçi agenti stillərini tamamilə aradan qaldırır. Nümunə:

/* Eric Meyer-in Reset CSS nümunəsi */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* Reset stilinin qalan hissəsi */

Normalize.css: Brauzerlər arasında daha uyğun və sabit stil təmin etmək üçün istifadəçi agenti stillərini düzəldir, faydalı əsas stilləri saxlayır.

/* Normalize.css nümunəsi */
html {
  line-height: 1.15; /* 1 */
  -webkit-text-size-adjust: 100%; /* 2 */
}
body {
  margin: 0;
}
/* Normalizə olunmuş stilin qalan hissəsi */

DevTools-də yoxlama: Brauzerin inkişaf alətləri, hansı istifadəçi agenti stillərinin konkret elementə tətbiq olunduğunu görməyə imkan verir.

İstifadəçi agenti stillərini anlamaq, elementlərin proqnozlaşdırıla bilən görünüşünü təmin etmək və brauzer uyğunluğunu artırmaq üçün vacibdir.

İstifadəçi agenti stilləri nədir və onlarla işləmək üçün hansı üsullar mövcuddur?