Теги заголовків. Зміна розміру шрифту

Заголовки розділів сторінки систематизують ін­формацію, що представляється, і повинні бути корот­кими, зрозумілими, інформативними і привабливи­ми. Якщо виникає необхідність виділити окремі фра­гменти тексту, щоб звернути на них особливу увагу читача, можна використовувати теги, що змінюють розмір символів. Вигляд сторінки значною мірою за­лежить від розміру вікна браузера, та HTML дозво­ляє вставити на сторінку фрагмент, вигляд і форма­тування якого не залежатиме від розміру вікна.

<Нп>...</Нп> — тег керує розміром символів у заголовках (1<п<6), які відображаються жирнішим шрифтом.

<BIG>...</BIG> — збільшує розмір шрифту на 10% порівняно з базовим.

<SMALL>...</SMALL> — зменшує розмір шри­фту на 10% порівняно з базовим.

<PRE>...</PRE> — позначає фрагмент тексту, форматування якого здійснено наперед. Зручно ви­користовувати під час виведення програм, записаних мовами програмування, виведення тексту, що міс­тить спеціальні символи, у деяких випадках замінює тег <NOBR>...</NOBR>.

Горизонтальні лінії

Лінії застосовуються для організації тексту і для дизайну. Вони можуть використовуватися в будь-якому місці сторінки. Після тега <HR> автоматич­но виконується переведення рядка аналогічно тегу <Р>. Дійсно, елемент <HR> створює прямокутник, який, змінюючи параметри, можна перетворити на горизонтальну або вертикальну лінію, також може використовуватися як маркер.

<HR> — тег горизонтальної лінії, може бути за­собом організації тексту і дизайну. Запроваджуєть­ся в будь-якому місці сторінки, автоматично вико­нує перехід на новий рядок.

align=Left (Right, Center) — вирівнювання лінії на сторінці.

saze=n — товщина лінії в пікселях (1п175) за умовчанням 2 пікселі.

со1ог="." — колір лінії задається назвою кольору або 16-ковим кодом (додаток №1).

— ширина лінії у відсотках до ширини екрану.

noshade — атрибут без параметра, показує об'єм­ні лінії, встановлюється за замовчуванням.

shade — атрибут без параметра показує контур лінії, якщо заданий колір, атрибут не працює.

Порядок виконання роботи

1. Відкрийте сторінку «Перший досвід» для ре­дагування HTML-коду.

2. Завдання для самостійної роботи. Визначте розділи сторінки заголовками:

• «Про себе» — 2 рівня;

• «Біографія» — 3 рівня;

• «Мої захоплення» — 3 рівня;

• «Мої досягнення» — 3 рівня;

• «Це цікаво» — 2 рівня;

• «Вчитися, вчитися і вчитися» — 2 рівня;

•у розділ «Біографія» вставте фрагмент «один до одного»:

 

Мені 15 років.

      Я живу в місті Євпаторія.

               Вчуся в загальноосвітній школі № 12.

•доповніть розділ «Біографія» короткими біогра­фічними відомостями про себе;

•виділіть фрагменти сторінки, змінюючи розмір шрифту , наприклад, так:

 

Радий вітати Вас на моїй сторінці.

Я — Сергій.

Не судіть мене суворо — це мій перший досвід

у створенні web-сторінок, але я зобов'язуюся

старанно освоювати ази Web-дизайну, постійно

вдосконалювати й оновлювати свою сторінку.

Мій учитель сподівається, що в кінці року йому не соромно

буде дивитися на моє творіння.

3. Збережіть зміни в програмі Блокнот і перегляньте результат у браузері. Розмір символів виділе­них фрагментів змінився.

4. Завдання для самостійної роботи:

•виділіть розділи сторінки горизонтальними ліні­ями (3-4 лінії) відповідно до її структури;

•підберіть для ліній вирівнювання, товщину, ши­рину і колір;

•перевірте роботу всіх атрибутів і їх значень.

ПРАКТИЧНА РОБОТА №4

Мета: Навчитися застосовувати на прак­тиці теги вирівнювання тексту на сторінці та теги зміни зображення символів у випадку виділення смислових фрагментів сторінки.

Теоретична частина Параметри вирівнювання тексту

Під час створення WEB-сторінок можна викорис­товувати цілу низку засобів форматування елемен­тів, що дозволяє оживити сторінку, зробити її яскра­вішою, так, що вона запам'ятовується, та додати строго індивідуальний вигляд. Серед таких засобів і

можливості з вирівнювання елементів на сторінці. Вирівнювати можна заголовки, текст, лінії, графічні елементи. Теги вирівнювання, зазвичай, парні.

<LEFT> . </LEFT> — вирівнювання тексту по лівому краю сторінки.

<RIGHT> . </RIGHT> — вирівнювання тексту по правому краю сторінки.

<CENTER> . <CENTER> — вирівнювання текс­ту по середині сторінки.

Властивості вирівнювання тексту має й елемент параграф: <Р align=Left >...</P> —.

align= Left — атрибут вирівнювання тексту в ме­жах параграфа [значення: Right, Center, Justify].

<BR> — обриває рядок і починає новий.

clear=Left — вирівнювання об'єктів щодо тексту [значення: None, Right, All].

Зміна зображення символів

На WEB-сторінках можна використовувати весь набір зміни зображення символів. Використання рі­зних стилів зображення символів дозволяє виділи­ти або звернути особливу увагу відвідувача на окре­мі важливіші фрагменти сторінки.

<В>...</В> — виділення напівжирним шрифтом.

<І>...</І> — виділення курсивом.

<SUB>~.</SUB> — нижні індекси.

<SUP>~.</SUP> — верхні індекси.

Порядок виконання роботи

1. Відкрийте сторінку «Перший досвід» для ре­дагування HTML-коду.

2. Змініть вирівнювання елементів сторінки:

•для заголовків використовуйте теги вирівнювання;

•для параграфів задайте атрибут align, наприк­лад, так:

Радий вітати Вас на моїй сторінці.

Я — Сергій.

Не судіть мене суворо — це мій перший досвід у створенні web-сторінок, але я зобов'язуюся старанно освоювати ази Web-дизайну, постійно вдосконалювати й оновлювати свою сторінку.

Мій учитель сподівається, що в кінці року йому не соромно буде дивитися на моє творіння.

3. Збережіть зміни в програмі Блокнот і прогля­ньте результат у браузері. Вирівнювання парагра­фів і абзаців змінилося відповідно до форматування.

4. Змініть зображення фрагментів сторінки, до­давши на сторінку курсив, наприклад, так:

Не судіть мене суворо — це мій перший досвід у створенні web-сторінок, але я зобов'язуюся старанно освоювати ази Web-дизайну, постійно вдосконалювати й оновлювати свою сторінку.

Мій учитель сподівається, що в кінціроку йому не соромно буде дивитися на моє творіння.

•у розділ «Учитися, учитися і вчитися» додайте текст, зберігши форматування зразка:

Для тренування:

Я жайворонок лягаю спати о 22⁰⁰

Формула сірчаної кислоти H₂SO₄

5. Збережіть зміни в програмі Блокнот і прогляньте результат у браузері. Зображення символів на сторінці змінилося відповідно до заданого форматування.

 

ПРАКТИЧНА РОБОТА №5

Мета роботи Навчитися використовувати теги зміни зображення символів для виділення смисло­вих фрагментів сторінки. Навчитися розміщувати в документі спеціальні символи, використовуючи їх мнемонічні і числові коди. Навчитися задавати ба­зовий стиль для тексту сторінки, змінювати стилі окремих абзаців, виділяти цитати на сторінці.

Теоретична частина

Закреслення і підкреслення. Виділення вставлених і видалених фрагментів тексту

Якщо необхідно звернути увагу відвідувачів на змі­ни в змісті сторінки, фрагменти тексту можна поміти­ти як вставлені або видалені. У разі перегляду фрагме­нти виділяються підкресленням або закресленням, да­ні теги мають атрибути, що дозволяють внести додат­кову інформацію про причину і характер змін.

У HTML і браузерах реалізована можливість про­мальовування символів за їх кодами. Спецсимволи, використовувані в HTML як службові та ін., можуть вводитися двома способами: мнемонічним кодуван­ням або вказівкою його ASCII-коду. Спецсимволи по­винні вводитися тільки за допомогою кодів. Коди час­то використовуваних символів наведені в додатку №2.

<S>...</S> — закреслений текст.

<U>...</U> — підкреслений текст.

<BLINK>...</BLINK> — мерехтіння в Internet Explorer не працює.

<DEL>...</DEL> — виділяє текст (закреслен­ням), який необхідно позначити як видалений (зас­тарілий).

<INS>...</INS> — виділяє текст (підкреслен­ням), який необхідно позначити як вставлений.

cite=URL — адреса джерела або документа, у якому пояснюється причина змін.

datetime=2004-10-02 — дата, коли були проведені зміни.

<ABBR>... </ABBR> — використовується для виділення абревіатур.

<ACRONYM>... </ACRONYM> — використовуєть­ся під час виділення акронімів (наприклад: іт.д.;іт.п.).

---

Дата добавления: 2020-04-25; просмотров: 392; Мы поможем в написании вашей работы!

Поделиться с друзьями:

---

---

Мы поможем в написании ваших работ!