Матеріал для вивчення мови розмітки HTML ідеально підходить, як шпаргалка для початківців
Мова HTML
Відомості з історії
Знайомство з мовою HTML
Гіпертекст – це електронний документ, що містить гіперпосилання на інші документи. Гіпертекстовий документ призначений для виведення інформації на екран комп'ютера.
Гіпертекстова технологія – це технологія, що базується на використанні гіпертекстових документів. Її застосовують у комп'ютерних енциклопедіях і навчальних програмах, прикладних програмах для роботи з довідковою інформацією й для організації доступу до інформації в WWW, тобто при роботі з WEB-документами.
WEB-документ – це текст, написаний мовою HTML або іншою, що призначений для перегляду електронної інформації на екрані комп'ютера за допомогою програми-браузера.
Коди мови HTML
<HTML> </HTML> – документ HTML
Коди заголовка сторінки
<HEAD> </HEAD> – розділ заголовків
<TITLE> </TITLE> – міститься текст заголовка
Коди документа
<BODY> </BODY> – тіло документа (текст документа)
Заголовок документа
різних рівнів
<H1> </H1>
<H2> </H2>
<H3> </H3>
<H4> </H4>
<H5> </H5>
<H6> </H6>
Відцентровування тексту
<CENTER> </CENTER> – по цетру
<RIGHT> </RIGHT> – по правому краю
<LEFT> </LEFT> – по лівому краю
Форматування тексту
<B> </B> – напівжирний
<I> </I> – курсивий
<U> </U> – підкреслений
<S> </S> – перекреслений
<SUP> </SUP> – верхній індекс
<SUB> </SUB> – нижній індекс
<BIG> </BIG> – збільшує розмір шрифту на одиницю відносно поточного рівня
<SMALL> </SMALL> – зменшує розмір шрифту на одиницю відносно поточного рівня
<EM> </EM> – виділення важливих фрагментів тексту (текст відображається курсивом)
<DEL> </DEL> – створення перекресленого тексту (текст буде перекреслено горизонтальною лінією)
<MARQUEE> </MARQUEE> – додають рухомий рядок
Колірне оформлення сторінок
<BODY BGCOLOR=050056 TEXT=455558> – запис тега з параметрами;
BACKGROUND=”URL” – замість URL вказують адресу малюнка, який має бути тлом сторінки;
BGCOLOR=”050056” – задає колір, який має бути фоновим для документа;
TEXT=”455558” – задає колір тексту;
LINK=”RED” – визначає колір гіперпосилань у документі;
ALINK=”12453f” – задає колір гіперпосилань під час клацання;
VLINK=”110212” – задає колір переглянутих гіперпосилань;
Побудова таблиць
<TABLE> </TABLE> – задає таблицю.
<CAPTION> </CAPTION> – задає заголовок таблиці.
TOP – встановлює заголовок таблиці перед таблицею (за замовчуванням)
BOTTON – встановлює заголовок таблиці після таблиці
ALING=bottom – встановлює заголовок таблиці після таблиці
<TR> </TR> – Задає рядок таблиці
<TH> </TH> – Задає комірку заголовок таблиці
<TD> </TD > – Задає комірку таблиці
WIDTH=500 (50%) – задає ширину таблиці
BORDER=5 – задає товщину ліній таблиці
СOLSPAN=3 – об’єднує горизонтальні комірки таблиці
ROWSPAN=3 – об’єднує вертикальні комірки таблиці
<TABLE BGCOLOR=cyan> – задає колір таблиці
Вирівнювання даних в таблиці
По горизонталі
<TD ALIGN=center> – запис
ALIGN=center – зразок
center– горизонтальне вирівнювання по центру вмістимості комірки
right– горизонтальне вирівнювання по правому краю вмістимості комірки
left– горизонтальне вирівнювання по лівому краю вмістимості комірки
justify– горизонтальне вирівнювання по ширині вмістимості комірки
По вертикалі
<TD VALIGN=top> – запис
VALIGN=top – зразок
top – вертикальне вирівнювання по верхньому краю вмістимості комірки
bottom – вертикальне вирівнювання по нижньому краю вмістимості комірки
middle – вертикальне вирівнювання по центру вмістимості комірки
Оформлення рамок таблиць
Зовнішніх
<TABLE FRAME=box> – запис
FRAME=box – зразок
box – всі чотири сторони рамки
above – лише верхню межу рамки
below – лише нижню межу рамки
lhs – лише ліву межу рамки
rhs – лише праву межу рамки
hsides – верхню і нижню межі рамки
vsides – ліву і праву межі рамки
void – зовнішня рамка не відображається
Внутрішніх
<TABLE RULES=all> – запис
RULES=all – зразок
all – відображаються всі вертикальні та горизонтальні лінії
rows – лише горизонтальні лінії між рядками
cols – лише вертикальні лінії між стовпцями
none – не показувати роздільних ліній
Робота з списками
<LH> </LH> – описує заголовок списку
<UL> </UL> – задає означення (тип) списку
<LI> – рядок списку
<OL> </OL> – нумерований список
<UL> </UL> – ненумерований список
<OL TYPE=”А”> </OL> – вказує тип списку
Список означень
<DL> </DL> – вказує на тип списку
<DT> – формує рядок терміну
<DD> – формує рядок тлумачень терміну
Вставка
Вставка гіперпосилань
<A HREF =”newinf.htm”>Гіперпосилання</A>
LINK = ”RED” – визначає колір гіперпосилань у документі;
ALINK = ”12453f” – задає колір гіперпосилань під час клацання;
VLINK = ”110212” – задає колір переглянутих гіперпосилань;
Вставка графічних файлів
<IMG SRC=”адрес графічного файлу” ALT=”альтернативний текст” ALING=”left” WIDTH=240 HEIGHT=200 BORDER=”товщина рамки в пікселях”>
Вставка відео-файлів
<IMG DYNSRC = ”адрес відео файлу”>
Вставка звуку і відеозображення
<A HREF = ”mysound.wav”>послухай мене (150)</A>
LOOP=2 – звучання декілька разів
<BGSOUND SRC = ”адрес звукового файлу”> – звук починається у момент запуску сторінки
<EMBED SRC = ”адрес звукового файлу”> – отримаємо магнітофонну панель для регулювання тривалості й сили звуку, припинення звучання, продовження тощо.
Вставка динамічних ефектів
<MARQUEE> … </MARQUEE> – бігучий рядок
<MARQUEE BGCOLOR = ”green” HEIGHT = 40> … </MARQUEE>
BEHAVIOR = ”alternate” – зупиняє рядок біля лівого краю екрана
slide – зупинка рядка біля лівого краю
DIRECTION = ”right” – рух у протилежний бік
Фрейми
Рамки – фрейми – метод для розділення екрану на декілька частин, в кожній із яких міститься окрема Web-сторінка або цілий Web-сайта.
<FRAMESET> и </FRAMESET> Теги для створення рамки
Параметри тегу <FRAMESET>
COLS – поділяє екран на визначене число колонок (вертикальних)
ROWS – поділяє екран на визначене число колонок (горизонтальних)
BORDCOLOR – колір рамки
BORDER – ширина рамки
FRAMEBORDER – межа рамки (FRAMEBORDER=YES – є межа, FRAMEBORDER=NO – немає межі, FRAMESPACING=n – ширина межі)
<FRAME> Тег для описання рамки (<FRAME SRC="file.htm">).
Параметри тегу <FRAME>
SCROLLING – параметр для регулювання полоси прокрутки:
SCROLLING=YES – полоса прокрутки є завжди
SCROLLING=NO – полоси прокрутки не буде
SCROLLING=AUTO – полоса прокрутки появляється тільки у випадку необхідності
MARGINWIDHT и MARGINHEIGHT – параметри, які керують відступом всередині рамок, служать для вирівнювання графічних зображень всередині рамки
NORESIZE – параметр, який вказує що розмір фрейму ніколи не буде мінятися.
A link to <A HREF="file.htm" TARGET="frame2"> file.htm</A> – Зв’язок між фреймами
TARGET – атрибут зв’язку між фреймами. Має декілька значень:
BLANK загружає вміст сторінки, заданою посиланням, в новому пустому вікні.
SELF зміст сторінки, заданою посиланням, у вікні, в якому міститься дане посилання.
PARENT зміст сторінки, заданою посиланням, у вікні, в якому міститься дане посилання, яке є безпосереднім власником набору фреймів
TOP зміст сторінки заданою посиланням, у вікні, яке не виконує використання фреймів.
Обробка браузерів, не підтримуючих фрейми:
<FRAMESET>...тут містяться фрейми</FRAMESET>
<NOFRAMES>
<BODY>
Тут міститься текст фреймів
<BODY>
</NOFRAMES>
1