Home-theater-designers
Jedną z pierwszych funkcji, o których nauczyli się programiści, gdy zajęli się przetwarzaniem tekstu, było wyrównanie tekstu. To małe narzędzie było niezbędne zarówno dla profesjonalnych zecerów, jak i amatorskich projektantów ulotek. Nic dziwnego, że CSS obsługuje wyrównanie tekstu, jeśli chodzi o projektowanie stron internetowych.
ten wyrównanie tekstu Właściwość, wraz z jedną lub dwiema innymi, kontroluje sposób, w jaki element wyrównuje tekst w poziomie. Poza podstawami przeglądarki powoli wdrażają więcej specyfikacji, ale pełne wsparcie jest różne. Dowiedz się, jak wyrównać tekst i jakie funkcje obsługują obecnie popularne przeglądarki.
Podstawy właściwości CSS text-align
Wyrównanie jest jednym z najbardziej znanych terminów typograficznych . W kontekście CSS, wyrównanie tekstu odnosi się do wyrównania w poziomie.
Wyrównanie tekstu w poziomie dotyczy tylko kontenerów blokowych. Są to elementy o pełnej szerokości, takie jak akapity i elementy div. Używając wyrównanie tekstu właściwość na elemencie wbudowanym, takim jak w nie przyniesie efektu. Możesz także wyrównać elementy listy i komórki tabeli:
jak grać w stare gry w systemie Windows 10
Domyślnie w języku pisanym od lewej do prawej (więcej o tym później) tekst jest wyrównywany do lewej:
W CSS jest to to samo co:
p { text-align: left; }Lub:
p { text-align: start; }Związane z: Co to są kaskadowe arkusze stylów i do czego służy CSS?
Możesz użyć innych wartości dla wyrównanie tekstu właściwość, aby zmienić wyrównanie w poziomie. Najpopularniejsze wartości są znane z aplikacji do przetwarzania tekstu:
text-align: left
text-align: center
text-align: rightUżyj wyrównania, aby wyrównać lewą i prawą krawędź
Inna popularna wartość dla wyrównanie tekstu jest uzasadniać . Przeglądarki dodają przestrzeń do wyjustowanego tekstu, tak aby każda linia rozciągała się, aby wypełnić dostępną przestrzeń:
Kiedy justujesz tekst, ostatnia linia może być trudna. Ponieważ może być bardzo krótki (być może tylko jedno słowo), odstępowanie go na całej szerokości może być brzydkie. Domyślnie nawet wyjustowany tekst wyrówna ostatnią linię do lewej.
iPhone 6 nie tworzy kopii zapasowej na icloud
Czasami możesz chcieć uzyskać inny efekt. Implementacje przeglądarek doganiają specyfikację, ale możliwe są dwa podejścia.
ten uzasadnić wszystko wartość powinna oznaczać, że przeglądarki traktują ostatnią linię jak wszystkie inne i rozciągają ją do pełnej szerokości. Jednak w chwili pisania tego tekstu żadna przeglądarka nie obsługuje tej wartości. Możesz sprawdź Caniuse, aby zobaczyć, czy tak kiedy czytasz ten artykuł.
Kolejna właściwość CSS, tekst-wyrównaj-ostatni , jest bardziej elastyczny i ma lepsze wsparcie. Możesz traktować to mniej więcej tak samo jak wyrównanie tekstu , ale dotyczy tylko ostatniej linii:
Obsługa przeglądarki dla tej właściwości jest lepsza, ale nie idealna. Ponownie, sprawdź caniuse przed użyciem . Jeśli przeglądarka nie rozpoznaje tej właściwości, zignoruje ją.
Wyrównanie tekstu i kierunek czytania
Być może pracujesz w języku, takim jak arabski lub hebrajski, który czyta się od prawej do lewej. CSS używa kierunek właściwość, aby to określić, na przykład:
direction: rtl;Te języki zazwyczaj domyślnie wyrównują tekst do prawej.
Zamiast konieczności sprecyzowania lewo / Prawidłowy , preferowany sposób wyrównania tekstu wykorzystuje wartości początek oraz kończyć się . Określa, czy tekst powinien być wyrównany na początku każdego wiersza, czy na końcu. W językach pisanych od lewej do prawej, początek jest równa lewo . W języku pisanym od prawej do lewej tekst zaczyna się z prawej strony, a kończy z lewej.
Przywracanie ustawień fabrycznych systemu Windows 10 z rozruchu
Za pomocą początek lub kończyć się oznacza, że niezależnie od kierunku tekstu wyrównanie jest spójne.
Jak elementy dziedziczą właściwość text-align
Należy mieć świadomość, że wyrównanie tekstu własność dziedziczy. Na przykład, jeśli ustawisz go na ciało element, będzie miał zastosowanie do każdego elementu na stronie. Możesz oczywiście nadpisać to na dowolnym elemencie.
Używanie właściwości text-align do sterowania układem
Możesz użyć wyrównanie tekstu Właściwość CSS definiująca sposób, w jaki przeglądarki układają tekst w poziomie. Najczęstsze wartości to lewo , Prawidłowy , środek , oraz uzasadniać . Są to dość proste, chociaż uzasadniać wprowadza pewną złożoność.
Należy oszczędnie używać wyrównania tekstu. Na bilbordach i plakatach wyrównanie centralne może być odpowiednie, ale może utrudnić czytanie dłuższych bloków tekstu. Wyrównanie jest zwykle bardziej czytelne, gdy wiersze tekstu są dłuższe. Justowanie krótkich kolumn tekstu może powodować brzydkie odstępy.
ten wyrównanie tekstu właściwość jest jedną z wielu właściwości CSS, które zapewniają przydatne formatowanie i podstawowe pozycjonowanie.
Udział Udział Ćwierkać E-mail 10 prostych przykładów kodu CSS, których możesz się nauczyć w 10 minutPotrzebujesz pomocy z CSS? Wypróbuj te podstawowe przykłady kodu CSS na początek, a następnie zastosuj je na swoich stronach internetowych.
Czytaj dalej Powiązane tematy- Programowanie
- Tworzenie stron internetowych
- Projektowanie stron
- CSS
Bobby jest entuzjastą technologii, który przez prawie dwie dekady pracował jako programista. Pasjonuje się grami, pracuje jako redaktor recenzji w magazynie Switch Player i jest zanurzony we wszystkich aspektach publikowania online i tworzenia stron internetowych.
Więcej od Bobby'ego JackaZapisz się do naszego newslettera
Dołącz do naszego newslettera, aby otrzymywać porady techniczne, recenzje, bezpłatne e-booki i ekskluzywne oferty!
Kliknij tutaj, aby zasubskrybować