Як зробити відступ у тексті HTML за допомогою CSS?
У цій статті ми обговоримо різні способи відступу тексту в документі HTML. Текстовий відступ використовується для встановлення довжини порожнього простору перед рядками тексту в блоці. Зазвичай він позначає початок абзацу.
Існує кілька поширених підходів до відступу тексту:
Зміст
- Використання властивості margin-left
- Використання властивості text-indent
- Використання властивості padding-left
Використовуючи властивість margin-left :
Ця властивість використовується для додавання поля зліва від елемента. Його можна використовувати для додавання необхідного відступу, вказавши необхідний простір у відповідних одиницях довжини або відсотках.
приклад: У цьому прикладі використовується властивість margin-left для відступу всього блоку тексту.
HTML
> <> html> >> <> head> >> > <> style> >> > p {> > margin-left: 40px;> > }> > style>голова> |
Вихід:
Використовуючи властивість text-indent:
Ця властивість використовується для встановлення кількості простору перед першим рядком тексту в абзаці. За потреби його можна вказати в одиницях довжини або у відсотках.
приклад: У цьому прикладі перший рядок абзацу має відступ за допомогою властивості text-indent.
HTML
> <> html> >> <> head> >> > <> style> >> > p {> > text-indent: 40px;> > }> > style>голова> |
Вихід:
Використання властивість padding-left :
Властивість padding-left у CSS визначає відстань між лівим краєм поля вмісту елемента та його внутрішнім вмістом. Він створює відступи з лівого боку, відсуваючи вміст від лівої межі елемента, забезпечуючи інтервали та відступи.
приклад: У цьому прикладі ми використовуємо властивість padding left із прикладом.
HTML
> <> html> >> <> head> >> > <> style> >> > p {> > padding-left: 60px;> > }> > style>голова> |
Вихід: