КАТЕГОРИИ:
Архитектура-(3434)Астрономия-(809)Биология-(7483)Биотехнологии-(1457)Военное дело-(14632)Высокие технологии-(1363)География-(913)Геология-(1438)Государство-(451)Демография-(1065)Дом-(47672)Журналистика и СМИ-(912)Изобретательство-(14524)Иностранные языки-(4268)Информатика-(17799)Искусство-(1338)История-(13644)Компьютеры-(11121)Косметика-(55)Кулинария-(373)Культура-(8427)Лингвистика-(374)Литература-(1642)Маркетинг-(23702)Математика-(16968)Машиностроение-(1700)Медицина-(12668)Менеджмент-(24684)Механика-(15423)Науковедение-(506)Образование-(11852)Охрана труда-(3308)Педагогика-(5571)Полиграфия-(1312)Политика-(7869)Право-(5454)Приборостроение-(1369)Программирование-(2801)Производство-(97182)Промышленность-(8706)Психология-(18388)Религия-(3217)Связь-(10668)Сельское хозяйство-(299)Социология-(6455)Спорт-(42831)Строительство-(4793)Торговля-(5050)Транспорт-(2929)Туризм-(1568)Физика-(3942)Философия-(17015)Финансы-(26596)Химия-(22929)Экология-(12095)Экономика-(9961)Электроника-(8441)Электротехника-(4623)Энергетика-(12629)Юриспруденция-(1492)Ядерная техника-(1748)
Графіка всередині HTML–документа
|
|
|
|
Створення списків
Мова HTML передбачає спеціальний набір тегів для представлення інформації у вигляді списків. Найчастіше використовуються маркеровані та нумеровані списки. Можна створювати також вкладені списки, використовуючи різні теги списків або повторюючи одні усередині інших.
Нумерований список утворюють за допомогою тега–контейнера <OL>…</OL>. Кожний елемент списку починається з тега <LI>. Список може мати заголовок, який охоплюється парним тегом <LH>…</LH>. Схематично нумерований список має такий вигляд:
<LH> заголовок списку </ LH>
<OL>
<LI> Перший пункт списку
<LI> Другий пункт списку
<LI> Третій пункт списку
..............................................
</OL>
Тег <OL> може мати параметр TYPE, який задає спосіб нумерації. Можливі такі значення параметра TYPE:
I – нумерація великими Римськими цифрами (I, II, III...);
i – нумерація малими Римськими цифрами (i, ii, iii...);
a – нумерація малими латинськими літерами (а, b, c...);
А – нумерація великими латинськими літерами (A, B, C...);
1 – нумерація малими арабськими цифрами (1, 2, 3...).
В маркерованих списках для виділення його елементів використовують спеціальні символи, які називають маркерами списку. Для створення маркерованого списку використовують тег–контейнер <UL>…</UL>, всередині якого розміщають усі елементи списку. Кожен елемент списку починається з тега <LI>. Схематично маркерований список має такий вигляд:
<UL>
<LI> Перший пункт списку
<LI> Другий пункт списку
<LI> Третій пункт списку
…………………………….
</UL>
Тег <UL> може мати параметр TYPE, який визначає зовнішній вигляд маркера. Типовими значеннями маркера є такі:
TYPE=disc – маркери відображаються зафарбованими кільцями;
TYPE= circle – маркери відображаються не зафарбованими кільцями;
TYPE=square – маркери відображаються зафарбованими квадратиками.
Наприклад:
<UL TYPE=square>
<LI> Перший пункт списку
<LI> Другий пункт списку
<LI> Третій пункт списку
…………………………....
</UL>
.
Для створення вбудованих зображень у HTML–документі необхідно використати тег IMG, який має один обов’язковий параметр SRC, що вказує на адресу URL–файлу із зображенням. Найпростіший приклад вбудовування зображення:
<IMG SRC= “picture.gif” >.
Для доступу до віддалених файлів, які є на серверах у мережі Internet, адресу записують із значенням назви протоколу доступу http і адреси файлу. Наприклад:
<IMG SRC= “http://www.lac.lviv.ua/pic.gif”>.
Тег <IMG> може мати ряд інших параметрів. Найважливішими є наступні.
HEIGHT і WIDTH – визначають відповідно ширину і висоту зображення; (значення параметрів можна задавати як у пікселях, так і у відсотках від розмірів вікна перегляду). Якщо вказані значення не співпадають з реальним розміром зображення, зображення масштабується.
HSPACE і VSPACE – визначають відступ картинки (в пікселях) по горизонталі і вертикалі від інших об'єктів документа (використовуються при обтіканні зображення текстом).
ALIGN – вказує спосіб вирівнювання зображення в документі (параметр ALIGN може приймати значення: left, right, center, вказані в табл. 3).
NAME – визначає ім'я зображення, унікальне для даного документа.
ALT – визначає текст з описом зображення, що відображається браузером на місці зображення, якщо браузер не може знайти файл із зображенням або, якщо відключено графічний режим.
BORDER – визначає ширину рамки навколо зображення (в пікселях). За замовчуванням рамка навколо зображення не відображається. Винятком є випадок, якщо зображення є гіпертекстовим посиланням. В таких випадках значення BORDER звичайно вказують рівним нулю.
Для опису фонового зображення використовується параметр BACKGROUND тега BODY, значенням якого є ім'я файла, в якому місититься фонове зображення. Наприклад:
<BODY BACKGROUND= “picture.gif”>.
До моменту завантаження зображення і відображення фонового зображення колір фону визначається значенням параметра BGCOLOR.
Щоб задати кольори посилань, необхідно включити в тег <BODY> відповідний параметр (LINK, ALINK, VLINK) (табл.1). Колір задається шестизначним числом в шістнадцятковому форматі за схемою RGB (Red, Green, Blue). Наприклад: <BODY BGCOLOR=“#000000” TEXT=“#FFFFFF” LINK=“#9690CC”>. Даний рядок визначає білий колір фону документа, чорний текст і сріблясті посилання.
Створення та розміщення таблиць в HTML–документі
В HTML таблицівикористовуються не тільки традиційно, як метод представлення даних, але і як метод форматування Web–сторінок.Окрім типового застосування таблиць для представлення числових даних, таблиці служать для форматування документа, встановлення взаємного розміщення елементів сторінки.
Опис таблиці розміщається всередині тега <BODY>.
Кожна таблиця задається парою тегів <TABLE>…</TABLE>. Всередині цієї пари тегів розташовується опис вмісту таблиці. Кожен рядок обрамлюється парою тегів <TR>…</TR>, окрема клітинка – парою тегів <TD>…</TD>. Для клітинок–заголовків використовується пара тегів <TH>…</TH>.
За замовчуванням таблиця відображається без рамки, а розмітка здійснюється автоматично залежно від обсягу інформації, що міститься в ній.
Таблиця може мати заголовок, який поміщається між парою тегів <CAPTION>…</CAPTION>. Опис заголовку таблиці повинен розміщатися всередині пари тегів <TABLE>…</TABLE> у будь–якому місці, однак, поза зоною опису будь–якого з парних тегів <TR>, <TD> або <TH>.
Тег <CAPTION> має один допустимий параметр ALIGN, який приймає значення TOP (заголовок над таблицею) або BOTTOM (заголовок під таблицею). У більшості випадків в якості заголовку таблиці використовується текст, однак, між тегами <CAPTION>…</CAPTION> можна записувати будь–які HTML–елементи, що використовуються в розділі <BODY>.
Для розміщення таблиці на сторінці використовують параметри тега <TABLE>, наведені в табл.5. В найпростішому випадку тег <TABLE> використовується без параметрів, їх значення приймають за замовчуванням.
Таблиця 5
Призначення параметрів тега <TABLE> та їх можливі значення
| Параметр | Призначення параметра та можливі його значення |
| ALIGN | задає спосіб горизонтального вирівнювання таблиці в області перегляду. Можливі значення: left, сеnter, right. Значення за замовчуванням – left. |
| VALIGN | задає спосіб вертикального вирівнювання таблиці в області перегляду. Можливі значення: top, bottom, middle. |
| BORDER | задає ширину зовнішньої рамки таблиці (в пікселях). При значенні BORDER=“0” або за відсутності цього атрибута рамка відображатися не буде. |
| CELLPADDING | задає відстань (в пікселях) між рамкою клітинки таблиці і даними всередині клітинки |
| CELLSPACING | задає відстань (в пікселях) між межами сусідніх клітинок |
| WIDTH | задає ширину таблиці. Ширина задається або в пікселях, або в процентному відношенні до ширини вікна браузера. |
| HEIGHT | задає висоту таблиці. Висота задається або в пікселях, або в процентному відношенні до висоти вікна браузера. |
| BGCOLOR | задає колір фону елементів таблиці. Задається або RGB– значенням в шістнадцятковій системі, або значенням одного з 16 базових кольорів. |
| BACKGROUND | дозволяє використати для заповнення фону таблиці зображення. Як значення необхідно вказати URL–адресу рисунка. |
Для форматування даних всередині клітинок таблиці передбачені параметри, наведені в табл.6.
Таблиця 6
Призначення та можливі значення параметрівформатування даних
всередині таблиці
| Назва параметра | Призначеня та можливі значення параметрів |
| ALIGN | вказує спосіб горизонтального вирівнювання вмісту клітинки; можливі значення: left, сеnter, right (за замовчуванням спосіб вирівнювання визначається значенням атрибута ALIGN елемента TR) |
| VALIGN | вказує спосіб вертикального вирівнювання вмісту клітинки. Можливі значення: top, bottom, middle (за замовчуванням відбувається вирівнювання по центру (VALIGN="middle"), якщо значення цього атрибута не було задано раніше в елементі TR) |
| BGCOLOR | вказує колір фону клітинки (задається або RGB–значенням в шістнадцятковій системі, або значенням одного з 16 базових кольорів) |
| WIDTH | вказує ширину клітинки (задається в пікселях або в процентному відношенні до ширини таблиці) |
| HEIGHT | вказує висоту клітинки (задається в пікселах або в процентному відношенні до висоти таблиці) |
| BACKGROUND | заповнює клітинки фоновим рисунком (необхідно вказати ім'я файла, в якому міститься фонове зображення) |
|
|
|
|
|
Дата добавления: 2014-10-15; Просмотров: 431; Нарушение авторских прав?; Мы поможем в написании вашей работы!