- •Міністерство освіти і науки україни Запорізький національний технічний університет методичні вказівки
- •“Основи Internet”
- •1 Загальні вимоги до виконання курсової роботи
- •2 Основні теги html
- •3 Форми
- •4 Використання технології ssi
- •-Призначена для виводу значень змінних оточення і дати, формат якої визначається параметром timefmt директиви config. В echo єдиний параметр var, він визначає виведене значення.
- •-Відображає розмір певного файлу. Формат виводу задається за допомогою параметра sizefmt директиви config. Синтаксис використання наступний
- •-Вставляє результат виконання команди або cgi-програми в html-документ.
- •5 Каскадні таблиці стилів css
- •5 Приклад застосування каскадних таблиць стилів
- •7 Основи javascript
- •Література
- •Перелік програм для створення сайтів
- •Адреси для хостингу
2 Основні теги html
Передбачається, що на момент виконання курсової роботи студенти володіють достатніми навичками з використання мови HTML, яка вивчалась на першому курсі, тому в даному розділі наведено лише короткий перелік основних тегів та їх атрибутів.
Таблиця 2.1
|
Основні теги |
|
|
<html></html> |
Указує програмі браузеру що це HTML документ. |
|
<head></head> |
Тут розташовується тег назви документа, теги для пошукових машин, МЕТА теги. |
|
<body></body> |
Визначає видиму частину документа. |
|
<title></title> |
Поміщає назву документа у вікні Браузера. |
|
Атрибути тіла документа |
|
|
<body bgcolor=?> |
Установлює кольори тла документа, використовуючи значення кольорів у вигляді RRGGBB - приклад: #FF0000 - червоні кольори. |
|
<body text=?> |
Установлює кольори тексту документа. |
|
<body link=?> |
Установлює кольори гіперпосилань. |
|
<body vlink=?> |
Установлює кольори гіперпосилань на яких ви вже побували. |
|
<body alink=?> |
Установлює кольори гіперпосилань при натисканні. |
|
Теги для форматування тексту |
|
|
<pre></pre> |
Обрамляє попередньо відформатований текст. |
|
<h1></h1> |
Створює НАЙБІЛЬШИЙ заголовок |
|
<h6></h6> |
Створює самий маленький заголовок |
|
<b></b> |
Створює жирний текст |
|
<i></i> |
Створює похилий текст |
|
<tt></tt> |
Створює стиль, що імітує друкарську машинку. |
|
<cite></cite> |
Використовується для цитат. |
|
<strong></strong> |
Використовується для виділення найбільш важливих частин тексту (похилий або жирний текст) |
|
<font size=?></font> |
Установлює розмір тексту (від1 до 7) |
|
<font color=?></font> |
Установлює кольори тексту, використовуючи значення кольорів у вигляді RRGGBB. |
|
Гіперпосилання |
|
|
<a href="URL"></a> |
Створює гіперпосилання на інші документи або частину поточного документа. |
|
<a href = "mailto:EMAIL"> </a> |
Створює гіперпосилання виклику поштової програми для написання листа авторові документа. |
|
<a name="NAME"></a> |
Відзначає частину тексту як ціль для гіперпосилання у документі. |
|
<a href="#NAME"></a> |
Створює гіперпосилання на частину поточного документа. |
|
Форматування |
|
|
<p> |
Створює новий параграф |
|
<p align=?> |
Вирівнює параграф щодо однієї зі сторін документа, значення: left, right, або center |
|
<br> |
Перехід на новий рядок |
|
<blockquote> </blockquote> |
Створює відступи по обидва боки тексту. |
|
<dl></dl> |
Створює список визначень. |
|
<dt> |
Визначає кожний з термінів списку |
|
<dd> |
Описує кожне визначення |
|
<ol></ol> |
Створює нумерований список |
|
<li> |
Визначає кожний елемент списку й привласнює номер |
|
<ul></ul> |
Створює ненумерований список |
|
<li> |
Визначає кожний елемент списку й додає іконку. |
|
<div align=?> |
Тег контейнер для форматування блоків тексту HTML документа, також використається в таблицях стилів |
|
Графічні теги |
|
|
<img src="name"> |
Додає зображення в HTML документ |
|
<img src="name" align=?> |
Вирівнює зображення до однієї зі сторін документа, приймає значення: left, right, center; bottom, top, middle |
|
<img src="name" border=?> |
Встановлює товщину рамки навколо зображення |
|
<hr> |
Додає в HTML документ горизонтальну лінію. |
|
<hr size=?> |
Установлює висоту(товщину) лінії |
|
<hr width=?> |
Установлює ширину лінії, можна вказати ширину в пікселах або відсотках. |
|
<hr noshade> |
Створює лінію без тіні. |
|
<hr color=?> |
Задає лінії певні кольори. Значення RRGGBB. |
|
Таблиці |
|
|
<table></table> |
Створює таблицю. |
|
<tr></tr> |
Визначає рядок у таблиці. |
|
<td></td> |
Визначає окремий осередок у таблиці. |
|
<th></th> |
Визначає заголовок таблиці (нормальний осередок з відцентрованим жирним текстом) |
|
Атрибути таблиці |
|
|
<table border=#> |
Задає товщину рамки таблиці. |
|
<table cellspacing=#> |
Задає відстань між осередками таблиці. |
|
<table cellpadding=#> |
Задає відстань між змістом осередку і рамкою. |
|
<table width=#> |
Установлює ширину таблиці в пікселах або відсотках від ширини документа. |
|
<tr align=?> або <td align=?> |
Установлює вирівнювання осередків у таблиці, приймає значення: left, center, або right. |
|
<tr valign=?> або <td valign=?> |
Установлює вертикальне вирівнювання для осередків таблиці, приймає значення : top, middle, або bottom. |
|
<td colspan=#> |
Об’єднання стовбців таблиці |
|
<td rowspan=#> |
Об’єднання рядків таблиці |
|
<td nowrap> |
Не дозволяє браузеру робити перенос рядка в осередку таблиці. |
|
Фрейми |
|
|
<frameset></frameset> |
Визначая фрейм |
|
<frameset rows="value,value"> |
Визначає розмір рядків в таблиці фреймів кількістю пікселів або в процентному співвідношенні до висоти таблиці фреймів. |
|
<frameset cols="value,value"> |
Визначає розмір стовпців в таблиці фреймів. |
|
<frame> |
Визначає одиничний фрейм. |
|
<noframes></noframes> |
Визначає, що буде показано у вікні браузера якщо він не підтримує фрейми. |
|
Атрибути фреймів |
|
|
<frame src="URL"> |
Визначає який з HTML документів буде показаний у фреймі. |
|
<frame name="name"> |
Указує ім'я фрейму або області, що дозволяє перенаправляти інформацію в цей фрейм. |
|
<frame marginwidth=#> |
Визначає величину відступів по лівому й правому краях фрейму |
|
<frame marginheight=#> |
Визначає величину відступів по верхньому й нижньому краях фрейму |
|
<frame scrolling=VALUE> |
Указує, чи будет виводитись лінійка прокручування; значення value може бути "yes," "no," або "auto". документів - auto. |