Мова HTML. Основні теги (2 частина)

  1. Створення списків на сторінці. Списки визначень.

<UL> … </UL> – організація інформації у вигляді маркірованого списку.

type=circle – тип маркера у вигляді кружка (disk – кільце, square – квадратик).

<OL> … </OL> – організація інформації у вигляді нумерованого списку.

start=”n” – номер з якого починається нумерація

type=” … ” – вид нумерації – A – заголовні латинські букви, а – малі латинські букви, I — римські цифри заголовними латинськими буквами, i – римські цифри малими латинськими буквами, 1 – арабські цифри.

<LI> – пункт списку і маркірованого і нумерованого.

<DL> … </DL> – тег, що описує списки визначень.

<DT> – пункт списку (термін).

<DD> – визначення пункту списку (терміну),  для пункту списку може бути представлені декілька визначень.

2. Розміщення інформації в таблиці. Об’єднання осередків.

<TABLE> … </TABLE> – тег, що описує таблицю.

аlign= – вирівнювання таблиці по горизонталі (значення: Left, Center, Right).

width= ширина таблиці (значення: число в пікселях або число% у відсотках до ширини вікна браузера).

bgcolor= – колір заливки елементів таблиці, задається стандартним чином.

border= – показує на екрані сітку таблиці (значення: число – товщина лінії), якщо параметр рівний 0 лінії не видно.

background=”URL” – адреса файлу того, що містить фоновий малюнок.

<TC> … </TC> – заголовок таблиці.

<TH> … </TH> – заголовки рядків і стовпців.

colspan=n – об’єднання клітинок в рядку n – кількість об’єднуваних осередків.

<TR> … </TR> – визначають рядки таблиці.

<TD> … </TD> – розбивають рядок на осередки.

align= – вирівнювання тексту в осередку по горизонталі (Left, Center, Right).

valign= – вирівнювання тексту в осередку по вертикалі (Top – по верхньому краю; Middle – по середині; Bottom по нижньому краю).

rowspan=n – об’єднання осередків в стовпці, n – кількість об’єднуваних осередків.

3. Вставка малюнка на сторінку.

<IMG src=URL> розміщення картинки на сторінці, якщо картинка в тій же теці що і сторінка указується її ім’я, наприклад: <IMG src=dog.jpeg> інакше указується повна адреса: <IMG src=http://www.ecc.crimea.ua/dog.jpeg>

alt=”Підпис до картинки” – виводиться на екран якщо у браузера відключений режим показу картинок або картинка не знайдена;

title=”Підпис до картинки” – виводиться на екран при наведенні на картинку покажчика миші;

align=”…” – позиціонування картинки щодо тексту;

width=”…”вертикальний розмір картинки (значення: число) – задається в пікселях;

height=”…”горизонтальний розмір картинки (значення: число) – задається в пікселях, якщо заданий тільки один параметр, другий, – змінюється пропорційно (зменшення розміру не скорочує часу завантаження).

4. Використання гіперпосилань на сторінці. Прості сайти. Навігація по сайту з використанням фреймів.

<A>”Елемент”</A> – тег гіперпосилання,

href=URL – атрибут, вказуючий адресу документа;

href=”http://www.netscape.com” – посилання указує на документ що знаходиться мережі Інтернет;

href=”file:///C:/temp\text.txt” – посилання указує на документ на локальному диску;

href=”../my web/my photo.jpeg” – посилання указує на документ що знаходиться в теці того ж рівня;

href=”./my web/my photo.jpeg” – посилання указує на документ, що знаходиться у вкладеній теці;

href=”mailto:kalamit@ecc.crimea.ua” – викликає діалог відправки електронного повідомлення за вказаною адресою.

title=”Підпис до посилання” – виводиться на екран при наведенні на посилання покажчика миші (якщо посилання на великий документ або малюнок правила хорошого тону рекомендують указувати тут розмір файлу);

 

Тег BODY має атрибути, які дозволяють змінити кольори посилань:

link=”.” – колір посилань, що не використалися, на сторінці (задається стандартним способом);

vlink=”.” – колір посилань, що використалися, на сторінці (задається стандартним способом);

alink=”.” – колір активного посилання на сторінці (задається стандартним способом);

 

<A name=”Lab1”><H2>”Мои увлечения”</H2></A> – елемент (якір) – розділ на сторінці, на який указує посилання.

<A href=”#Lab1”>”Увлечения”</A> – посилання на розділ сторінки.

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *

*