1.4. Урок 3: Робота з текстом.

Основними елементами форматування тексту в html є:

- P

Використовується для розбивання тексту на параграфи

- H1, H2, ... H6

Застосовуються для створення заголовків 1,2 ... 6 рівнів

- BR

Іспользуетcя для переносу рядка

- DIV, SPAN

Використовуються для виділення частини документа певним способом.

P - використовується для розмітки параграфів у html документах.

атрибути :

ALIGN - визначає спосіб горизонтального вирівнювання параграфа.

Можливі значення : left , center , right , justify . Це відповідно по лівому краю , по центру , по правому краю , і по ширині . За замовчуванням має значення left .

Наведу приклад:

Якщо всередині тіла документа написати наступне :

<p align="center"> Цей параграф по центру </ p >

<p align="left"> Цей по лівому краю </ p >

<p > Цей теж по лівому (тому за замовчуванням) </ p >

<p align="right"> Цей по правому краю </ p >

<p align="justify"> У цьому параграфі текст буде вирівнюватися по ширині (одночасно по лівому і правому краях документа). Не розуміють justify браузери будуть вирівнювати текст по лівому краю </ p >.

Примітка: слідкуйте щоб вміст в лапках було написано без пробілів, тобто <p align="right"> а не <p align=" right "> інакше не працюватиме!

H1 , H2 , ... H6 - Застосовуються для розбивання тексту на смислові рівні - розділи і підрозділи . Існує шість рівнів заголовків , різняться за величиною шрифту.

атрибути :

ALIGN - визначає спосіб горизонтального вирівнювання заголовків.

Можливі значення : left , center , right . Типово - left .

Наведу приклад:

Якщо всередині тіла документа написати наступне :

<! - Приклади заголовків від 1 до 6 рівня ->

<h1> Великий заголовок </ h1 >

<h2> Тема поменше </ h2 >

<h3> Ще менше </ h3 >

<h4> Зовсім маленький </ h4 >

<h5> Малюсенький заголовочек </ h5 >

<h6> Ну просто ліліпутські заголовочек </ h6 >

Примітка: закривати тег обов'язковий!

BR - даний елемент здійснює перенесення рядка. Не має закриває тега.

Наведу приклад:

Якщо всередині тіла документа написати наступне:

Починається перший рядок <br>

тепер йде друга <br>

а от вже і третя

<p> А це параграф і всередині нього теж можна використовувати тег <br> перенесення строкі.Его треба використовувати завжди, коли треба перенести рядок :) </ p>.

DIV - У сучасному Сайтобудування використовується як зручний контейнер для блоків html коду сторінки , яким легко динамічно маніпулювати - переміщати , регулювати відступи , приховувати і т.п. Обов'язковий закриває тег !

атрибути :

ALIGN - визначає спосіб горизонтального вирівнювання контейнера.

Можливі значення : left , center , right , justify . Це відповідно по лівому краю , по центру , по правому краю , і по ширині . За замовчуванням має значення left .

Припустимо нам потрібно вирівняти перші два рядки тексту з попереднього прикладу по правому краю , не виділяючи при цьому їх в абзац . Як це зробити?

<div align="right">

Починається перший рядок <br> тепер йде друга <br>

</ div >

а от вже і третя

<p>

А це параграф і всередині нього теж можна використовувати тег <br> перенесення строкі.Его треба використовувати завжди , коли треба перенести рядок :) </ p >.

Примітка: Знаходяться між початковим і кінцевим тегами текст або HTML-елементи виділяються як би в окремий параграф (але відступи набагато менше).

наприклад:

Поки що ви читаєте текст на першому рядку <div> Але тепер вже на другий </ div> .

SPAN - Використовується для виділення частини інформації і надання їй різних стилів. Закриває тег обов'язковий!

Сам по собі, без використання стилів, елемент SPAN ніякого сенсу не має!

наприклад:

Хочете користуватися <span> Adobe Dreamweaver </ span> - тоді вивчіть хоча б основи html і <br>

тоді Ви без проблем розберетеся з цією чудовою програмою!

Як бачите, як ніби ми нічого і не виділяли! Але якщо прописати який нибудь стиль цього тегу, то він почне працювати!

Хочете користуватися <span style="color:red;"> Adobe Dreamweaver </ span> - тоді вивчіть хоча б основи html і <br>

тоді Ви без проблем розберетеся з цією чудовою програмою!

Таким чином за допомогою елемента SPAN можна хоч кожній букві в тексті привласнити різний стиль (колір, розмір, і.т.д.).