Ostatnio edytowany:

letter-spacing

Autor: Virtual Patriot

Opis właściwości letter-spacing

Za pomocą właściwości letter-spacing możemy określić rozmiar odstępu pomiędzy znakami tworzącymi tekst interesującego nas elementu HTML.

Dodatkowe techniczne informacje o właściwości letter-spacing

przeznaczenie
  • element HTML każdego typu
dziedziczenie
  • tak
wartość initial
wyjątki initial
  • brak
animowanie
  • tak, lecz tylko wartość rozmiar

Interpretacja właściwości letter-spacing

Firefox

tak

Google Chrome

tak

Safari

tak

Opera

tak

Internet Explorer

tak

Edge

tak

Opis wartości właściwości letter-spacing

normal

Opis

Wartość normal jest domyślną wartością właściwości letter-spacing.

Domyślnie znaki tworzące tekst elementu HTML oddzielone są od siebie o wartość określoną przez przeglądarkę internetową.

Przykład

znaki tworzące tekst tego elementu "div" oddzielone są od siebie o wartość określoną przez przeglądarkę internetową

Kod źródłowy przykładu

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
    <title>Darmowy Kurs CSS</title>

    <style>
      html {
        font-size:16px;
        font-family:Helvetica, sans-serif;
      }

      div {
        padding:1em;
        font-size:1.3em;
        background-color:#AFF;
      }
    </style>
  </head>

  <body>

    <div>
      znaki tworzące tekst tego elementu "div" oddzielone są od siebie o wartość określoną przez przeglądarkę internetową
    </div>

  </body>
</html>

rozmiar

Opis

Za pomocą właściwości letter-spacing oraz dowolnej liczby wraz z wybraną jednostką absolutną lub jednostką relatywną możemy określić rozmiar odstępu pomiędzy znakami tworzącymi tekst interesującego nas elementu HTML.

Wartości ujemne

wartości ujemne zwężają odstęp pomiędzy znakami tworzącymi tekst elementu HTML, lecz nie wszystkie przeglądarki internetowe muszą interpretować tę cechę

Przykład

rozmiar odstępu pomiędzy znakami tworzącymi tekst tego elementu "div" wynosi 6 pikseli, ponieważ do tego elementu "div" została dodana właściwość "letter-spacing" wraz z wartością "6px"

Kod źródłowy przykładu

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="utf-8">
    <title>Darmowy Kurs CSS</title>

    <style>
      html {
        font-size:16px;
        font-family:Helvetica, sans-serif;
      }

      div {
        letter-spacing:6px;
        padding:1em;
        font-size:1.3em;
        background-color:#AFF;
      }
    </style>
  </head>

  <body>

    <div>
      rozmiar odstępu pomiędzy znakami tworzącymi tekst tego elementu "div" wynosi 6 pikseli, ponieważ do tego elementu "div" została dodana właściwość "letter-spacing" wraz z wartością "6px"
    </div>

  </body>
</html>