Полезное:
Как сделать разговор полезным и приятным
Как сделать объемную звезду своими руками
Как сделать то, что делать не хочется?
Как сделать погремушку
Как сделать так чтобы женщины сами знакомились с вами
Как сделать идею коммерческой
Как сделать хорошую растяжку ног?
Как сделать наш разум здоровым?
Как сделать, чтобы люди обманывали меньше
Вопрос 4. Как сделать так, чтобы вас уважали и ценили?
Как сделать лучше себе и другим людям
Как сделать свидание интересным?
Категории:
АрхитектураАстрономияБиологияГеографияГеологияИнформатикаИскусствоИсторияКулинарияКультураМаркетингМатематикаМедицинаМенеджментОхрана трудаПравоПроизводствоПсихологияРелигияСоциологияСпортТехникаФизикаФилософияХимияЭкологияЭкономикаЭлектроника
Основы HTML
|
|
HTML является приложением языка SGML (Standard Generalized Markup Language – разработан для пакетной компьютерной обработки документов), стандартизированного ISO в 1986 г. Базовый синтаксис и семантика языка HTML определены в стандарте, разрабатываемом под эгидой консорциума World Wide Web Consortium (W3C). Спецификации стандартов и проекты новых предложений представлены на сайте http://www.w3.org. Этот стандарт постоянно расширяется, главным образом за счет включения новых тегов, предлагаемых разработчиками браузеров. В настоящее время действует, т. е. поддерживается большинством браузеров, стандарт HTML 4.01. Однако фирмы-разработчики, такие, как Microsoft и Netscape, включают в свои браузеры собственные расширения, не входящие в стандарт. При разработке HTML-документов лучше ограничиться набором тегов, используемых в большинстве популярных браузеров.
Необходимо обратить внимание на следующие особенности HTML-документов:
– HTML-документы представляют собой текстовые файлы;
– HTML-документы могут быть просмотрены в Web-браузерах различных типов и на различных компьютерных системах (платформах);
– форматирование текста в целях его лучшей читаемости (включение отступов, символов табуляции, разбиение на строки и т. п.) возможно только с помощью специальных тегов.
Автор документа не может полностью определить внешний вид страницы по двум причинам: во-первых, возможности браузеров могут быть ограничены, во-вторых, в современных Web-браузерах существуют средства настройки размера и вида шрифта, цвета и других параметров, влияющих на отображение документа.
Любая HTML-страница состоит из двух логических частей: заголовка и тела. Заголовок документа содержит основную информацию о документе, в том числе название HTML-документа, которое отображается в строке заголовка Web-браузера. Тело документа интерпретируется браузером как содержимое Web-страницы. HTML-страница также состоит из размеченного тегами текста. Теги представляют собой определенную последовательность символов, заключенную между символами "<" и ">". Большинство тегов парные, закрывающий тег начинается с символа "/". Следующий фрагмент отображает базовую структуру HTML-документа:
<HTML>
<HEAD>
<TITLE> Электронный маркетинг </TITLE>
</HEAD>
<BODY>
Концепция электронного маркетинга.
</BODY>
</HTML>
Здесь представлены парные теги:
<HTML>…</HTML> – начальный и конечный теги всего HTML-доку-мента. Данный тег предназначен для того, чтобы браузер определил тип документа (HTML) и соответствующим образом его отобразил.
<HEAD>…</HEAD > – начальный и конечный теги заголовка документа. Тег заголовка должен быть указан сразу после тега <HTML> и не должен присутствовать в теле документа. Он отмечает общее описание документа и позволяет HTTP-серверу получить информацию о документе.
<TITLE>…</TITLE> – начальный и конечный теги названия страницы. Название, заключенное в теги <TITLE>…</TITLE>, должно размещаться внутри тегов <HEAD>…</HEAD>. Название страницы не является ее содержимым, а отображается в заголовке окна браузера.
<BODY>…</BODY>– начальный и конечный теги тела документа. Эти теги обязательно должны присутствовать в любом документе. Они определяют содержимое документа, которое отображается в браузере. Между тегами <BODY> и </BODY> заключены все теги, размечающие документ.
Все теги относятся к одному из следующих трех форматов:
<ИМЯ_ТЕГА>
<ИМЯ_ТЕГА> … </ИМЯ_ТЕГА>
<ИМЯ_ТЕГА имя_атрибута1=значение1имя_атрибута2=зна-чение2 …>… </ИМЯ_ТЕГА>.
Первый формат используется для непарных тегов. Например, непарным является тег <BR>, указывающий переход на новую строку. Во втором формате используются открывающий и завершающий теги. Они ограничивают часть документа, в которой могут присутствовать и другие теги. Третий формат используется для тегов, имеющих дополнительные атрибуты, задающие конкретные параметры. Атрибуты тега следуют за именем и отделяются от него и друг от друга пробелами или знаками табуляции. Последовательность атрибутов в теге значения не имеет. Если в таких тегах (а их большинство) атрибуты не указывать, то принимаются некоторые значения по умолчанию. Значения атрибутов заключаются в одинарные или двойные кавычки, кроме случаев, когда значением атрибута является одно слово или число. Некоторые атрибуты не принимают значения и присутствуют в теге в виде <ИМЯ_ТЕГА имя_атрибута>. Например, в теге <H1>, описывающем заголовок текста, можно использовать атрибуты выравнивания и задания размера:
<H1 ALIGN=Right Size=4 >.
Перечень основных тегов представлен в табл. 17.
| Т а б л и ц а 17 Основные теги языка гипертекстовой разметки HTML | ||
| Теги HTML | Описание тега | |
| Основные теги Web-документа | ||
| Тип документа | <HTML></HTML> | Сообщает браузеру, что документ написан на языке HTML |
| Имя документа | <TITLE></TITLE> | |
| Заголовок | <HEAD><HEAD> | Отмечает вводную и заголовочную часть HTML-доку-мента |
| Тело | <BODY></BODY> | Отмечает основной текст и информацию |
| Определение структуры | ||
| Заголовки | <Hi></Hi> | Оформление заголовка первого уровня |
| Заголовок с выравниванием | <Hi ALIGN=LEFT|CENTER|RIGHT></H?> | Оформление заголовка с выравниванием |
| Адрес автора | <ADDRESS></ADDRESS> | Содержит адрес электронной почты |
| Разделители | ||
| Абзац | <P></P> <P ALIGN=LEFT|CENTER|RIGHT></P> | Предписывает браузеру разделить два фрагмента с образованием пустой строки Возможно использование атрибута выравнивания ALIGN |
| Новая строка | <BR> | Предписывает браузеру разделить два фрагмента без образования пустой строки |
О к о н ч а н и е т а б л. 17
| Горизонтальный разделитель | <HR> ALIGN=LEFT|RIGHT|CENTER> | Отображение горизонтальной линии Возможно использование атрибута выравнивания ALIGN |
| Стилевое оформление текста | ||
| Жирный | <B></B> | Отображение текста полужирным шрифтом |
| Курсив | <I></I> | Отображение текста курсивом |
| Подчеркнутый | <U></U> | Отображение текста с подчеркиванием |
| Форматированный | <PRE></PRE> | Предписывает браузеру сохранение авторского формата текста |
| Управление шрифтом | <FONT COLOR =Name SIZE=I FACE="Courier New,Arial,…> </FONT> | Управление цветом и размером шрифта |
| Оформление списков | ||
| Нумерованный | <OL><LI></OL> | <LI> перед каждым элементом списка |
| Маркированный | <UL><LI></UL> | <LI> перед каждым элементом списка |
| Определение цвета и фона | ||
| Цвет фона | <BODY BGCOLOR="#$$$$$$"> | Предписывает браузеру цвет фона документа |
| Цвет текста | <BODY TEXT="#$$$$$$"> | Предписывает браузеру цвет текста в документе |
| Таблицы | ||
| Определить таблицу | <TABLE>теги описания строк </TABLE> <TABLE BORDER= ></TABLE> <TABLE WIDTH=> <TABLE WIDTH="%"> | Сообщает браузеру, что между данными тегами следует описание таблицы Задает обрамление таблицы Определение ширины таблицы в пикселах Определение ширины таблицы в % от ширины страницы |
| Строка таблицы | <TR></TR> | Определяет каждую строку таблицы |
| Ячейка таблицы | <TD></TD> <TD ALIGN=LEFT|RIGHT|CENTER|MIDDLE|BOTTOM> | Определяет текст каждой ячейки Возможно использование ат-рибута выравнивания ALIGN |
О к о н ч а н и е т а б л. 17
| Ссылки и графика | ||
| Ссылка | <A HREF="URL"></A> | Обеспечивает переход по URL-адресу |
| Графика | <IMG SRC="URL"> <IMG SRC="URL" ALIGN=TOP|BOTTOM|MIDDLE|LEFT|RIGHT> <IMG SRC="URL" ALT="***"> | Предписывает браузеру просмотр графического изображения Возможно выравнивание изображения относительно строки текста и задание альтернативного текста |
Большинство компаний на начальном этапе реализации электронного бизнеса используют статические Web-страницы, созданные на основе языка HTML. Однако запросы компаний растут, и рано или поздно возникает необходимость связывания Web-страниц с базами данных, динамичного обновления контента, внедрения мультимедийных приложений, обработки данных, поступающих от клиентов и других источников, и ряд других задач. Это осуществляется путем создания динамических страниц, которые значительно превосходят статические по удобству и гибкости, хотя и предъявляют повышенные требования к ресурсам сервера.
Язык HTML, являющийся в основном инструментом для публикации текстовых документов, не Предназначен для создания интерактивных страниц и мультимедийных документов. Однако совместное использование с HTML таблиц каскадных стилей CSS (Cascade Style Sheets), моделей объектов документа DOM (Document Object Model), JavaScript/VBScrip, получившее название DHTML, или динамический HTML, позволяет создать функциональные, динамичные и интерактивные Web-страницы.
Таблицы каскадных стилей CSS являются своего рода шаблонами, которые содержат набор правил, определяющих визуализацию, различных HTML-элементов. Они позволяют при размещении Web-элементов контролировать раскладку Web-страницы, динамически загружать шрифты, модернизировать дизайн Web-страницы, не касаясь их информационного наполнения. Пример использования CSS будет рассмотрен ниже.
DOM – это модель, в которой над объектами Web-страницы – элементами текста, изображениями, ссылками, можно выполнять различно рода действии, такие как удаление, изменение, добавление и другие.
Язык программирования JavaScript – это компактный, объектно-ориентированный, независимый от платформы, управляемый событиями язык сценариев, используемый для разработки Интернет-приложений, размещаемых как на стороне сервера, так и на стороне клиента.
Без обращения к серверу HTML-страница со встроенным JavaScript может, например, интерпретировать введенный текст и предупреждать пользователя о том, что во введенном тексте содержится ошибка. В качестве примера далее приведен текст HTML-документа, содержащего проверку введения имени пользователем:
<HTML>
<HEAD>
<TITLE>Пример использования JavaScript в HTML-документе < /TITLE>
</HEAD>
<script language="JavaScript">
<!--
function checkName()
{
if (document.addressform.firstname.value=="")
{alert("Пожалуйста введите Вашу фамилию!");}
}
//-->
</script>
<BODY>
Привет! Пожалуйста введите Вашу фамилию и нажмите Ok.
<form name=addressform>
<input type=text name=firstname>
<input type=text name=Ok value=Ok
onClick=checkName();>
</BODY>
</HTML>
JavaScript можно использовать для выполнения различных действий, например, для воспроизведения аудиофайлов, исполнения аплетов или взаимодействия с другими приложениями. Сценарии JavaScript ограничены клиентом и не могут взаимодействовать с сервером для обмена данными. JavaScript позволяет создавать кросс-платформенные сценарии событий (например, инициируемые нажатием мыши или клавиатуры) и действий, а также создавать взаимодействие между HTML, вспомогательными модулями и Java. Вопреки всеобщему заблуждению, JavaScript не является сокращенной версией языка Java или заменой сценариев CGI, о которых подробнее будет рассмотрено ниже. JavaScript был разработан компанией Netscape, а не Sun, которая разработала Java. Созвучное название было выбрано из маркетинговых соображений. Интерпретатор JavaScript в большинстве браузеров основывается на стандарте ECMAScript, который представляет собой стандартизированную версию JavaScript, поддерживаемую европейской организацией ECMA (http://www.ec-ma.ch/).
С помощью JavaScript даже не слишком опытные пользователи могут разрабатывать сценарии, обеспечивающие реакцию на различные события, объекты, действия.
Использование DHTML обеспечивает создание динамических Web-страниц на стороне клиента. Однако, несмотря на то, что DHTML – отличное решение для создания динамических Web-сайтов, оно используется в большинстве случаев для небольших Web-сайтов. Для масштабных Web-проектов целесообразно применение динамических Web-серверов, концепции создания которых будут рассмотрены в следующих параграфах.
Date: 2015-09-23; view: 544; Нарушение авторских прав