Студопедия

КАТЕГОРИИ:

АстрономияБиологияГеографияДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРиторикаСоциологияСпортСтроительствоТехнологияФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника


Створення документа в HTML




В HTML документи записуються в ASCII форматі й тому можуть бути створені і відредаговані в будь-якому текстовому редакторі.

Будь-який гіпертекст може бути розбитий на окремі структурні елементи: власне документ; глави, параграфи, пункти, підпункти; абзаци. Для кожного із цих елементів в HTML існують певні стилі, що описують у якому виді користувач побачить текст на екрані.

Основний текст відділяється від супровідного символами: <BODY> </BODY>. Для виділення заголовка документа служать символи:

<HEAD><TITLE>Заголовок</TITLE></HEAD>

Заголовок першого рівня (Глави) позначається символами <H1> і </H1>)

HTML має шість рівнів заголовків, що мають номери з 1 по 6 (заголовок першого рівня є заголовком вищого рівня). У порівнянні з нормальним текстом, заголовки виділяються шрифтом - розміром і товщиною букв. Перший заголовок в кожному документі повинен бути виділений <H1>. Синтаксис заголовків: <Hy> Текст заголовка </ Hy> де y - число від 1 до 6, що визначає рівень заголовка.

На відміну від документів в більшості текстових процесорів, переривання рядків і слів в HTML-файлах не є істотним. Обрив слова або рядка може відбуватися в будь-якому пункті у вашому вихідному файлі, при перегляді це переривання буде проігноровано. Браузер ігнорує це перериваніе рядка і починає новий абзац тільки, після знака <P>. Однак, щоб зберегти удобочитаемость у вихідних HTML-файлах, рекомендується заголовки розміщувати на окремих рядках, а абзаци відокремлювати порожніми рядками (на додаток до <P>). <P> Це абзац в HTML +. </ P>

Текст з абзацу в середіні рядка: <P ALIGN=CENTER>

Гіпертекстове посилання. Головна перевага HTML полягає в його здатності зв'язуватися з іншими документами. Browser виділяє (зазвичай кольором і / або підкресленням) ключові слова, які є гіпертекстовими посиланнями (гіперпосиланнями). Описується посилання на інший документ наступним чином: <A HREF="імя файла"> Текст, який буде служити як звернення до іншого документу </ A>.

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

<A Href="http://www.simtel.ru/news/snews.http">News</A>

HTML підтримує ненумеровані, нумеровані списки і списки визначень.

Ненумерований список: <UL> <LI> список пунктів </ UL>, наприклад:

<UL>

<LI> товар

<LI> постачальник

</ UL>,

Нумерований список ідентичний ненумерованого списку, тільки замість <UL> використовується <OL>.

<OL>

<LI> Підрозділ 1

<LI> Підрозділ 2

<LI> Підрозділ 3

</ OL>

Браузер автоматично нумерує елементи такого списку.

Списки можуть бути довільно вкладені (доцільно обмежитися трьома рівнями вкладених списків).

<UL>

<LI> Лояльні клієнти:

<UL>

<LI> Аванта

<LI> Таврія_В

</ UL>

<LI> Бідьш прибуткові постачальники:

<UL>

<LI> Метро

</ UL>

<LI> Идіал

</ UL>

<LI> Фоззі

</ UL>

</ UL>

Стилі. Є два типи стилів: логічний і фізичний. Логічні стилі визначають текст згідно заданому значенням, тоді як фізичні стилі визначають деякі ділянки тексту. Стилі дають користувачеві більшу свободу у виборі шрифтів.

Фізичні стилі - задається стиль написання тексту, описуючи шрифт у вихідному HTML-документі.

<B>, жирний шрифт (це жирний шрифт) </ B>

<I>, похилий шрифт (це похилий шрифт) </ I>

<TT>, фіксований шрифт ( заданої ширини) (це fixed шрифт)</ TT>

<BR> переривання рядка; - перехід на новий рядок, не починаючи нового абзацу (в більшості browser абзаци виділяються додатковими порожніми рядками

<HR> - розподіл тексту горизонтальною рисою.

Вставка малюнка <IMG SRC=1259/image_URL>

Автоматично, малюнок вирівнюється по нижньому краю супроводжуючого його текта, але можно задавати взаємне розташування малюнка і тексту. Форматування положення малюнка задається включенням у гіперпосилання пункту:

"ALIGN=" :<IMG ALIGN=top SRC=1259/image_URL>

Типи вирівнювання: ALIGN = MIDDLЕALIGN = CENTER

Таблиці: <TABLE BORDER=”10” WIDTH=”100”>

<CAPTION ALING=”TOP”Прайс ліст</ CAPTION>

<TR GRCOLOR=”RED”Aling=”Centre”

<TH>назва товару <TH> Ціна

<TR> - тег строки таблиці; <TD> - тег кожної ячейки таблиці

</TABLE>

Фрейми. <frameset Row=”60%,*”>

<Frame src=”і`мя файла1”>

<frameset cols=”35%,65%”noresize>

<Frame src=”і`мя файла2”>

<Frame src=”і`мя файла3”>

</frameset>

Приклад програми в HTML:

<HTML>

<META Charset = Windows-1251>

<HEAD>

<TITLE> Приклад програми на HTML </TITLE>

</HEAD>

<BODY>

<H1> Тіло програми Заголовок першого рівня</H1>

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

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

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

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

<IMG SRC = "pic/top100.GIF"><P>

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

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

<UL>

<LI> 1

<LI> 2

</UL>

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

</BODY>

</HTML>

Редактор HTML або HTML-редактор - комп'ютерна програма, що дозволяє складати і змінювати сторінки в форматі HTML. Незважаючи на те, що HTML-код може бути написаний на простому текстовому редакторі (наприклад, Notepad), спеціальні редактори для написання коду HTML пропонують більше зручностей і функціональності. Принцип їх роботи умовно ділиться на дві категорії: редактор показує тільки вихідний код; редактор показує готову сторінку, працюючи за технологією WYSIWYG. Є також редактори, що працюють за змішаною системою, тобто підтримують обидва принципи роботи. Комерційні редакторы, що підтримують технологию WYSIWYG: Adobe GoLive; IBM WebSphere Studio Homepage Builder; Adobe Dreamweaver; Macromedia HomeSite (с версии 5.0 не поддерживает WYSIWYG); Microsoft FrontPage; Namo Web Editor; NetObjects Fusion; WYSIWYG Web Builder. Редакторі, що вільно розповсюджуються та підтримують технологию WYSIWYG: FCKeditor, ZIP файл (1,287 Мб) ; Quanta Plus; HTMLArea; Microsoft FrontPage Express; Nvu; OpenOffice.org; TinyMCE. Редактори, що працюють з работающие з вихідним кодом:Macromedia HomeSite.


Поделиться:

Дата добавления: 2015-09-13; просмотров: 57; Мы поможем в написании вашей работы!; Нарушение авторских прав





lektsii.com - Лекции.Ком - 2014-2024 год. (0.007 сек.) Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав
Главная страница Случайная страница Контакты