КАТЕГОРИИ:
Архитектура-(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)
Лістинг 2.20. Файл chap2\styles\inline.htm
 |
Лістинг 2.19. Файл chap2\styles\embed.htm
<!"DOCTYPE HTML PUBLIC -//W3C//DTD HTML 3.2//EN">
<HTML>
<HEAD>
<ТIТLЕ>Вбудований таблиця стилів</ТIТLЕ>
<STYLE TYPE="text/css">
<!--
H1 { font-size: 24;
font-waigt: bold;
color: red;
margin-left: 10% }
H2 { font-size: 20;
font-weigt: bold;
color: black;
font-family: Courier }
P.italic { font-style: italic }
P.red { color: red }
-->
</STYLE>
</HEAD>
<BODY BGCOLOR=#FFFFFR>
<Н1>Заголовок перших рівні</Н1>
<Р>Звичайний текст <Н2>Заголовок другого рівня</Н2>
<Р CLASS=italic>Похилий текст
<Р CLASS=red>Текст червоного кольору
</BODY>
</НТМL>
Зовнішній вигляд цього документа при перегляді в навигаторе Microsoft Internet Explorer аналогічний показаному на мал. 2.18. Навігатор Netscape Navigator, як і в попередньому випадку, ігнорує стильове оформлення.
Зверніть увагу на використання оператора коментаря <!-- … -->. Коли документ переглядається навигатором, що не розпізнає стильового оформлення, такий навігатор проигнорирует як оператор <STYLE>, так і таблицю стилів. Якщо прибрати оператор коментаря, таблиця стилів з'явиться у вікні навигатора, що, очевидно, небажано.
2.9.1.7. Стилі в операторах HTML
Вказівкою в операторах оформлення тексту параметра CLASS можливо безпосередньо задавати параметри стильового оформлення. Відповідний приклад документа HTML приведений в лістинг 2.20.
<!"DOCTYPE HTML PUBLIC -//W3C//DTD HTML 3.2//EN">
<HTML>
<HEAD>
<ТITLE>Вбудований стилі</ТITLE>
</HEAD>
<BODY BGCOLOR=#FFFFFF>
<H1 STYLE="font-size: 24; font-weigt: bold; color: red; margin-left:10%">3аголовок першого рівня</Н1>
<Р>Звичайний текст
<Н2 STYLE="font-size: 20; font-weigt: bold; Color: black; font-family: Соurier">3аголовок другого рівня</Н2>
<Р STYLE="font-style: italic">Похилий текст
<Р STYLE="color: red">Текст червоного кольору
</BODY>
</HTML>
|
|
|
Тут визначаються ті ж самі параметри стильового оформлення, що і в двох попередніх випадках. Однак ці параметри вказуються не в файлі таблиці стилів і не в таблиці стилів, розташованій в заголовку документа, а безпосередньо в місці їх "вживання" - в операторах оформлення тексту.
3. ТАБЛИЦІ В ДОКУМЕНТАХ HTML
Дуже часто доводиться розміщувати в документі HTML табличні дані. Це можливо зробити двома способами.
Перший спосіб полягає в тому, що ви оформляєте текст таблиці шрифтом з фіксованою шириною символів, а для вирівнювання колонок використовуєте символи пропуску. Цей спосіб буде працювати, однак він навряд чи дозволить вам створити таблицю, яка буде виглядати красиво.
Другий спосіб передбачає використання операторів мови HTML, спеціально призначених для створення таблиць. Ці оператори відкривають широкі можливості: можливо використати рамки навколо всіх або тільки деяких осередків і рядків таблиці, створювати таблиці, що мають заголовки і підписи, розміщувати в елементах таблиці текст, графіку або довільні об'єкти, використати як фон для осередків растрові графічні зображення.
Для елемента таблиці можливо указати колірний фон і відступ, що дозволяючи зображати текст на кольоровому фоні з отбивкой. Цей прийом часто використовується в Internet, оскільки значно поліпшує зовнішній вигляд сторінки.
3.1. Найпростіша таблиця
Перш ніж перейти до докладного вивчення можливостей мови HTML по створенню таблиць, потрібно показати, як можливо створити найпростішу таблицю
У тексті документа HTML таблиця визначається між командами <TABLE> і </TABLE>. У найпростішому разі рядка таблиці обмежуються командами <TR> і </TR>, а стовпці (осередки рядка) - командами <TD> і </TD>, наприклад:
<ТАВLЕ>
<TR><TD>000</TD><TD>001</TD><TD>002</TD </TR>
<TR><TD>010</TD><TD>011</TD><TD>012</TD </TR>
<TR><TD>100</TD><TD>101</TD><TD>102</TD> </TR>
|
|
|
</TABLE>
Перший рядок, обмежений операторами <TR> і </TR>, складається з трьох осередків, в яких знаходяться рядки 000, 001 і 002. Кожний такий рядок обмежений операторами <TD> і </TD>.
Команди, які вжиті в цьому прикладі, допускають використання параметрів, які будуть розглянуті пізніше. Ці параметри впливають на зовнішній вигляд таблиці.
У лістинг 3.1 приведений початковий текст документа HTML, в якому визначені 2 таблиці. Перша з них складається з трьох рядків і не має ніякого додаткового оформлення. Друга таблиця отцентрирована, має рамку шириною 2 пікселя і ширину, що становить 60 % від ширини вікна перегляду навигатора.
|
|
|
|
|
Дата добавления: 2014-11-29; Просмотров: 430; Нарушение авторских прав?; Мы поможем в написании вашей работы!