Psevdoelement after

after psevdoelementi elementdən sonra mətn əlavə edir. Yalnız əlavə ediləcək mətni təyin edən content xüsusiyyəti ilə birlikdə istifadə olunur.

Sintaksis

cssselektor::after {
  content: 'mətn';
}

Nümunə

Gəlin elə edək ki, li üzərinə gəlindiyində onun sonuna mətn əlavə olunsun:

html<ul>
  <li>siyahı elementi</li>
  <li>siyahı elementi</li>
  <li>siyahı elementi</li>
  <li>siyahı elementi</li>
  <li>siyahı elementi</li>
</ul>

cssli:hover::after {
  content: '!!!';
}

Результат:

Nümunə

Əlavə olunan mətnə müxtəlif stillər tətbiq etmək olar. Gəlin, məsələn, bu mətni hansısa rəngə boyayaq:

html<ul>
  <li>siyahı elementi</li>
  <li>siyahı elementi</li>
  <li>siyahı elementi</li>
  <li>siyahı elementi</li>
  <li>siyahı elementi</li>
</ul>

cssli:hover::after {
  color: red;
  content: '!!!';
}

Результат:

Həmçinin bax