КАТЕГОРИИ:
Архитектура-(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.
Для створення Web-сторінок Web-дизайнери використовують гіпертекстові Web-редактори, наприклад, HotMetal PRO, Hot Dog Professional, Netscape Editor тощо, де використовується мова HTML — Hyper Text Markup Language (мова для розмічування гіпертекстових документів). Сучасні редактори
FrontPage і MS Word дають змогу створювати Web-сторінки методом конструювання без застосування кодів мови HTML, оскільки
коди вони генерують автоматично.
Для підготовки html-файлу можна використати текстовий редактор NotePad. Після написання програми файл потрібно зберегти на диску з деякою назвою з розширенням htm чи html. Програма мовою HTML (html-файл) має таку загальну структуру:
<HTML>
<HEAD>
<TITLE> Назва вікна Web-сторінки </TITLE>
</HEAD>
<BODY параметри>
Мене звати Світлана. Мені 17 років.
Я хочу стати Web-дизайнером.
Це моя перша Web-сторінка. Тут я можу писати будь-який текст, наприклад, про себе і мої інтереси. Пізніше я навчуся вставляти фотографії, картинки, звук, відеозображення шляхом посилання на відповідні графічні, звукові чи відеофайли. Я збережу цей файл на диску і відкрию його у броузері. Моя сторінка ще не красива і не цікава. Але скоро я навчуся робити прикольні Web-сторінки.
Я розташую файл на сервері і мою сторінку зможуть побачити в різних кінцях світу.
</BODY>
</HTML>
Команди мови HTML називаються тегами. Теги бувають одинарними і парними. Більшість тегів є парними, як наприклад, тег означення HTML-файлу: <HTML>... </HTML>. Парні теги позначають початок і кінець області дії відповідної команди. Теги записують у кутових дужках. Тег, що закриває область дії, має косу риску. Не забувайте її писати, інакше тег працюватиме неправильно. Тег може містити параметри, які користувач записує у першому тезі через пропуск, наприклад, <BODY TEXT="red">.
Між тегами <TITLE>...</TITLE> пишуть заголовок Windows-вікна, а між <BODY napaмeтpи>...</BODY> — основний текст, до якого застосовують теги форматування.
Розглянемо основні параметри тега BODY:
BACKGROUND = "шлях до графічного файлу"— задає картинку для фону; BGCOLOR = "white" — задає білий колір фону, якщо не використовується фон-картинка; TEXT = "black" — задає колір тексту (тут чорний) на сторінці. •
< Р > — початок нового абзаца; його прийнято записувати в кінці попереднього. Наступне речення починатиметься з нового, вирівняного до лівого краю абзаца без відступу у першому рядку.
<BR> — наступний за цим тегом текст буде наведено у новому рядку без пропуску порожнього рядка.
<HR> — буде проведена горизонтальна лінія.
<В> текст </В> — товстий шрифт тексту, що є між тегами.
<І> текст </І> — шрифт-курсив.
<U> текст </U> — підкреслений шрифт.
<SUB> текст </SUB> — нижній індекс, наприклад у Н20.
<SUP> текст </SUP> — верхній індекс, наприклад, 1П вулиця, а2.
<BIG> текст </BIG> — великий шрифт.
<SMALL> текст </SMALL> — малий шрифт.
<ЕМ> текст </ЕМ> — виокремлений курсивом текст (тег І).
<В> <І> текст </Іх/В> — товстий курсив. Цей приклад демонструє застосування принципу вкладення тегів.
Окремим типом абзаца є заголовок. Є шість видів заголовків, які відрізняються розмірами символів:
Теги Результат на екрані
<Н1>Заголовок 1</Н1> ЗАГОЛОВОК 1.
<Н2>Заголовок 2</Н2> ЗАГОЛОВОК 2.
<НЗ>Заголовок 3</Н3> ЗАГОЛОВОК 3.
<Н4>Заголовок 4</Н4> Заголовок 4.
<Н5>Заголовок 5</Н5> Заголовок 5.
<Н6>ЗаГОЛОВОК 6</Н6> Заголовок 6.
Заголовок за замовчуванням вирівнюється до лівого краю вікна. Якщо вирівнювання заголовка чи іншого елемента на сторінці потрібно задати явно, то використовують теги вирівнювання:
<CENTER> елемент </CENTER>— вирівнювання до центру; <LEFT> елемент </LEFT> — вирівнювання до лівого краю; <RIGHT> елемент </RIGHT> — вирівнювання до правого краю.
Інформацію можна подати у вигляді таблиці без рамок за допомогою парного тега <PRE>...</PRE>. Текст в середині цього тега оформляють засобами табуляції. Броузер такий текст пере-форматовувати не буде. Теги для створення таблиць з рамками тут не розглядатимемо.
Тег задання параметрів шрифта FONT.
Щоб задати назву конкретного шрифта, його розмір і колір використовують парний тег FONT з параметрами FACE, SIZE та COLOR, наприклад, <FONT FACE = "Decor, Arbat, Kudriashov" SIZE = +2 COLOR -"red"> текст </FONT>
Якщо на комп'ютері клієнта встановлено шрифт Decor, то він буде застосований до даного тексту, інакше броузер застосує шрифт Arbat чи Kudriashov, інакше — деякий свій стандартний шрифт, наприклад, Times New Roman. Розміри символів шрифта можуть бути від 1 до 7. Розмір 3 вважається стандартним, він орієнтовно відповідає 10 пікселям. Розмір 7 є найбільшим. Число 2 як значення параметра SIZE означає другий розмір шрифта, число +2 означає, що розмір шрифта має бути на дві одиниці більший, ніж стандартний, тобто п'ятий, число -2 означатиме перший розмір шрифта — на дві одиниці менший, ніж стандартний.
Колір тексту буде червоний. Основні кольори мають такі назви:
black — чорний green — зелений
navy — темно-синій teal — бірюзовий
silver — сірий lime — яскраво-зелений
blue — синій aqua — блакитний
maroon — малиновий olive — темно-зелений
purple— бузковий gray — темно-сірий
red — червоний yellow — жовтий
fushsia — рожевий white — білий
Лекція №14
Тема:
Програмування Web-сторінки, що містять списки, таблиці, посилання на графічні та відео файли
Мета:
§ Розкрити зміст поняття Web-сторінки, розглянути принципи побудови HTML-коду Web-сторінки
§ Розвивати логічне мислення.
§ Виховувати уважність, зосередженість, працелюбність.
|
Дата добавления: 2014-01-06; Просмотров: 2442; Нарушение авторских прав?; Мы поможем в написании вашей работы!