Przejdź do treści

CSS / Wykazy

Zawijanie tekstu {LIST-STYLE-POSITION}

Co zrobić, aby punkt wykazu (wyróżnik, marker) znajdował się wewnątrz tekstu?

selektor { list-style-position: pozycja }
Selektorem mogą być znaczniki dotyczące wykazów: ul - wypunktowanie, ol - wykaz numerowany oraz li - pojedynczy punkt wykazu [zobacz: Wstawianie stylów].

Natomiast "pozycja" określa, jak będą zawijane wiersze wykazu, które nie zmieszczą się w jednej linii. Możliwe są tutaj dwa przypadki:
  1. outside - wyróżniki na zewnątrz wykazu (domyślnie).

    Przykład:

    list-style-position: outside
    • Punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy.
    • Punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi.
    • Punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci.
  2. inside - wyróżniki wewnątrz wykazu.

    Przykład:

    list-style-position: inside
    • Punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy... punkt pierwszy.
    • Punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi... punkt drugi.
    • Punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci... punkt trzeci.

Komentarze

Zobacz więcej komentarzy

Facebook