Студопедия

КАТЕГОРИИ:


Архитектура-(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-документа:

<B> Це приклад <DFN> накладання стилів </B> в HTML-документі</DFN>

Слова "накладення стилів" визначені одночасно як <B> і <DFN>. Як реагуватимуть на це browser? Очевидно, що різні browser’и - по різному, і передбачити, яким насправді побачить Ваш текст користувач, не можна. Тому рекомендуємо Вам уникати такого накладення стилів.

Можна використовувати гіперпосилання усередині рядка заданого стилю:

<H1><A HREF = " begth_r1.html "> Введення в HTML </A></H1>

Але не можна змінювати стиль усередині гіперпосилання:

<A HREF = " begth_r1.html "> <H1> Введення в HTML </H1> </A>

Коли Ви описуєте посилання <IMG> на малюнок, якого не існує, він замінюється фіктивним зображенням. Перевірте, що малюнок існує, що в гіперпосиланні вказаний правильний, і що у користувачів є права на використання цього файлу.

Розглянемо довший приклад HTML-документа:

<HEAD>

<TITLE>; Більш довгий приклад</TITLE>

</HEAD>

<BODY>

<H1> Більш довгий приклад </H1>

Це простий HTML-документ. Це перший абзац. <P>

Це другий абзац, він демонструє деякі можливості HTML по виділенню слів.

Це слово написане <I> нахиленим </I> шрифтом. Це слово написане

<B>потовщеним</B> шрифтом.

Тут Ви можете побачити картинку:

<IMG SRC="/pics/digest/LOGO.GIF"><P>

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

Це гіперпосилання на файл minihtml.html, простий приклад HTML-документа, що містить:

<A HREF="minihtml.html">Приклад HTML-тексту</A>.<P>

<H2>Заголовок другого уровня</H2>

Подальший текст буде написаний шрифтом фіксованої ширини: <P>

<PRE> On the stiff twig up there Hunches а wet black rook Arranging and rearranging its feathers in the rain...

</PRE>

Це ненумерований список, що складається з двох елементів: <P>

<UL>

<LI> смородина

<LI> чорниця

</UL>

Кінець документа. <P>

<ADDRESS> Elena G. Koroteyeva ([email protected]) </ADDRESS>

</BODY>

(Мета-теги)

БАЗИСНІ ЕЛЕМЕНТИ
1. Тип документа <HTML></HTML> (початок і кінець файлу)
2. Ім’я документа <TITLE></TITLE> (повинно бути в заголовку)
3. Заголовок <HEAD></HEAD> (опис документа, наприклад його ім’я)
4. Тіло <BODY></BODY> (вміст сторінки)

 

ВИЗНАЧЕННЯ СТРУКТУРИ
5. Заголовок <H?> </H?> (стандарт визначає 6 рівнів)
6. із вирівнюванням <H?ALIGN=LEFT|CENTER|RIGHT></H?>  
7. Секція <DIV></DIV>  
8. із вирівнюванням <DIV ALIGN=LEFT|RIGHT|CENTER></DIV>  
9. Цитата <BLOCKQUOTE></BLOCKQUOTE> (звичайно виділяється відступом)
10. Виділення <EM></EM> (звичайно зображається курсивом)
11. Додаткове виділення <STRONG></STRONG> (звичайно зображається жирним шрифтом)
12. Відсилання, цитата <CITE></CITE> (звичайно курсив)
13. Код <CODE></CODE> (для лістингів коду)
14. Приклад висновку <SAMP></SAMP>  
15. Введення з клавіатури <KBD></KBD>  
16. Змінна <VAR></VAR>  
17. Визначення <DFN></DFN> (часто не підтримується)
18. Адреса автора <ADDRESS></ADDRESS>  
19. Великий шрифт <BIG></BIG>  
20. Маленький шрифт <SMALL></SMALL>  

 

СПИСКИ
  Неврегульований <UL><LI></UL> (<LI> перед кожним елементом)
  Компактний <UL COMPACT></UL>  
  Тип мітки <UL TYPE=DISC|CIRCLE|SQUARE> (для всього списку)
<LI TYPE=DISC|CIRCLE|SQUARE> (цей і подальші)
  Нумерований <OL><LI></OL> (<LI> перед кожним елементом)
  Компактний <OL COMPACT></OL>  
  Тип нумерації <OL TYPE=A|a|I|i|1> (для всього списку)
<LI TYPE=A|a|I|i|1> (цей і подальші)
  Перший номер <OL START=?> (для всього списку)
<LI VALUE=?> (цей і подальші)
  Список визначень <DL><DT><DD></DL> (<DT>=термін, <DD>=визначення)
  Компактний <DL COMPACT></DL>  
  Меню <MENU><LI></MENU> (<LI> перед кожним елементом)
  Компактне <MENU COMPACT></MENU>  
  Каталог <DIR><LI></DIR> (<LI> перед кожним елементом)
  Компактний <DIR COMPACT></DIR>  

 

ТАБЛИЦІ
Визначити таблицю <TABLE></TABLE>  
Окантовка таблиці <table border=?></TABLE>  
Окантовка таблиці <TABLE CELLSPACING=?>  
Відстань між осередками <TABLE CELLPADDING=?>  
Доповнення осередків <TABLE WIDTH=?> (у точках)
Ширина у відсотках <TABLE WIDTH="%"> (відсотки від ширини сторінки)
Рядок таблиці <TR></TR>  
Вирівнювання <TR ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM>  
Комірка таблиці <TD></TD> (повинна бути усередині рядка)
10. Вирівнювання <TD ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM>  
11. Без зміни рядка <TD NOWRAP>  
12. Розтягання по колонці <TD COLSPAN=?>  
13. Розтягання по рядку <TD ROWSPAN=?>  
14. Бажана ширина <TD WIDTH=?> (у точках)
15. Ширина в процентах <TD WIDTH="%"> (відсотки від ширини сторінки)
16. Колір комірки <TD BGCOLOR="#$$$$$$">  
Заголовок таблиці <TH></TH> (як дані, але жирний шрифт і центрівка)
Вирівнювання <TH ALIGN=LEFT|RIGHT| CENTER|MIDDLE|BOTTOM>  
Без зміни рядка <TH NOWRAP>  
Розтягання по колонці <TH COLSPAN=?>  
Розтягання по рядку <TH ROWSPAN=?>  
Бажана ширина <TH WIDTH=?> (у точках)
Ширина в відсотках <TH WIDTH="%"> (відсотки від ширини таблиці)
Колір комірки <TH BGCOLOR="#$$$$$$">  
Заголовок таблиці <CAPTION></CAPTION>  
Вирівнювання <CAPTION ALIGN=TOP|BOTTOM> (зверху/знизу таблиці)

Питання для самоконтролю

1. Абзаци розмітки HTML.

2. Авторський стиль редагування розмітки HTML.

3. Адреси розмітки HTML.

4. Вкладені списки розмітки HTML.

5. Внутрішні малюнки розмітки HTML.

6. Гіпертекст. Гіпертекстова технологія, броузери розмітки HTML.

7. Гіпертекстові редактори.

8. Графічні редактори розмітки HTML.

9. З’єднання з іншими документами, гіпертекстові посилання.

10. З’єднання з розділами поточного документа розмітки HTML.

11. Заголовки документів розмітки HTML.

12. Заголовки розділів документів розмітки HTML.

13. Зовнішні малюнки, звуки і мультиплікація розмітки HTML

14. Інструменти WEB-дизайну.

15. Логічні стилі розмітки HTML.

16. Мова HTML - Hyper Text Markup Language.

17. Мова гіпертекстової розмітки HTML.

18. Ненумеровані списки розмітки HTML.

19. Нумеровані списки розмітки HTML

20. Основні елементи мови HTML, теги.

21. Основні поняття WEB-дизайну.

22. Переривання строки розмітки HTML.

23. Різні стилі усередині гіперпосилання розмітки HTML.

24. Спеціальні символи розмітки HTML.

25. Списки визначень розмітки HTML.

26. Списки розмітки HTML.

27. Створення WEB-документів на мові гіпертекстової розмітки HTML.

28. Створення ВЕБ-документів на мові HTML

29. Стилі: логічні, фізичні стилі розмітки HTML.

30. Структурні елементи WEB-документа.

31. Текстові блоки розмітки HTML.

32. Технології та інструменти ВЕБ-дизайну

33. Фізичні стилі розмітки HTML.

34. Форми розмітки HTML.

35. Цитати розмітки HTML.

36. Що таке URL (Uniform Resource Locator)?

37. HTML документи: запис, створення, редагування та зберігання.

38. WEB-вузол (WEB-сайт).

39. Web-документ.


<== предыдущая лекция | следующая лекция ==>
Зовнішні малюнки, звуки і мультиплікація | Системи обробки тексту
Поделиться с друзьями:


Дата добавления: 2014-01-05; Просмотров: 428; Нарушение авторских прав?; Мы поможем в написании вашей работы!


Нам важно ваше мнение! Был ли полезен опубликованный материал? Да | Нет



studopedia.su - Студопедия (2013 - 2024) год. Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав! Последнее добавление




Генерация страницы за: 0.02 сек.