Jak wciąć tekst w HTML za pomocą CSS?
W tym artykule omówimy różne metody wcięcia tekstu w dokumencie HTML. Wcięcie tekstu służy do ustawiania długości pustego odstępu przed wierszami tekstu w bloku. Zwykle oznacza początek akapitu.
Istnieje kilka typowych podejść do wcięć tekstu:
Spis treści
- Korzystanie z właściwości marginesu lewego
- Korzystanie z właściwości text-indent
- Korzystanie z właściwości padding-left
Używając właściwość marginesu lewego :
Ta właściwość służy do dodawania marginesu po lewej stronie elementu. Można go użyć do dodania wymaganego wcięcia poprzez określenie potrzebnej przestrzeni w odpowiednich jednostkach długości lub procentach.
Przykład: W tym przykładzie użyto właściwości marginesu lewego do wcięcia całego bloku tekstu.
HTML
> <> html> >> <> head> >> > <> style> >> > p {> > margin-left: 40px;> > }> > style>głowa> |
Wyjście:
Używając właściwość wcięcia tekstu:
Ta właściwość służy do ustawiania odstępu przed pierwszą linią tekstu w akapicie. Można go określić w jednostkach długości lub w procentach, zgodnie z wymaganiami.
Przykład: W tym przykładzie pierwszy wiersz akapitu jest wcięty przy użyciu właściwości text-indent.
HTML
> <> html> >> <> head> >> > <> style> >> > p {> > text-indent: 40px;> > }> > style>głowa> |
Wyjście:
Za pomocą właściwość padding-left :
Właściwość padding-left w CSS określa ilość miejsca pomiędzy lewą krawędzią pola zawartości elementu a jego wewnętrzną zawartością. Tworzy dopełnienie po lewej stronie, odpychając zawartość od lewej krawędzi elementu i zapewniając odstępy i wcięcia.
Przykład: W tym przykładzie używamy właściwości padding left w przykładzie .
HTML
> <> html> >> <> head> >> > <> style> >> > p {> > padding-left: 60px;> > }> > style>głowa> |
Wyjście:
