Wyrównywanie tekstu - CSS-Tricks

text-alignWłaściwość CSS służy do wyrównywania wewnętrznego zawartość elementu blokowego.

p ( text-align: center; )

Oto tradycyjne wartości wyrównywania tekstu:

• left- wartość domyślna. Treść jest wyrównana po lewej stronie.
• right - Treść jest wyrównana wzdłuż prawej strony.
• center- Treść jest wyśrodkowana między lewą i prawą krawędzią. Białe odstępy po lewej i prawej stronie każdej linii powinny być równe.
• justify - Spacje treści tak, aby jak najwięcej bloków mieściło się w jednym wierszu, a pierwsze słowo w tym wierszu znajduje się wzdłuż lewej krawędzi, a ostatnie słowo wzdłuż prawej krawędzi.
• inherit - Wartość będzie taka sama, jak element nadrzędny.

„Treść” jest tu używana jako termin, a nie jako „tekst”, ponieważ chociaż wyrównanie tekstu z pewnością wpływa na tekst, ma wpływ na wszystkie elementy inline lub inline-block w tym kontenerze.

W CSS3 są również dwie nowe wartości, początek i koniec. Te wartości ułatwiają obsługę wielu języków. Na przykład angielski jest językiem zapisywanym od lewej do prawej (ltr), a arabski jest językiem pisanym od prawej do lewej (rtl). Używanie „prawej” i „lewej” dla wartości jest zbyt sztywne i nie dostosowuje się wraz ze zmianą kierunku. Te nowe wartości się dostosowują:

• start - To samo co „left” w ltr, to samo co „right” w rtl.
• end - To samo, co „right” w ltr, to samo, co „left” w rtl.

Istnieje również match-parent, co jest podobne do tego inherit, że nowa wartość jest obliczana względem kierunku bieżącego elementu, a nie, wiesz, nie robić tego.

W specyfikacji jest kilka rzeczy, które nie mają jeszcze obsługi przeglądarki. Jedną z nich jest wartość „start end”, która wyrówna pierwszą linię tak, jakby była „start”, a wszystkie kolejne wiersze tak, jakby była „end”. Innym jest nadanie wartości łańcuchowi znaków, na przykład text-align: "." start;Tekst zostanie wyrównany wzdłuż pierwszego wystąpienia tego, tak jak w celu wyrównania kolumny liczb wzdłuż przecinka dziesiętnego.

Przykłady

Ten tekst jest wyrównany do lewej.

Ten tekst jest wyrównany do prawej.

Jestem wyśrodkowany!

Jestem usprawiedliwiony. Wypełniam przestrzeń dokładnie (z wyjątkiem ostatniej linii), nawet jeśli czasami muszę się trochę rozciągnąć.

Dziedziczę wyrównanie mojego rodzica. W tym przypadku oznacza to pozostawienie.

Wsparcie przeglądarki

Dla lewej, prawej, środka, uzasadnij:

Chrom	Safari	Firefox	Opera	TO ZNACZY	Android	iOS
Każdy	Każdy	Każdy	3.5+	3+	Każdy	Każdy

Dla wartości starti end:

Chrom	Safari	Firefox	Opera	TO ZNACZY	Android	iOS
Każdy	3.1+	3.6+	Żaden	Żaden	Każdy	Każdy