- •080502 «Экономика и управление на предприятии (в городском хозяйстве)»
- •II. Содержание программы
- •1. История развития сети интернет
- •2. Сетевые службы интернета
- •3. Электронная почта в интернете
- •5. Информационно-поисковые системы и серверы
- •6 Проектирование web-страниц
- •III. Тематический план
- •Список источников и литературы
- •Перечень вопросов
- •1. Заголовки.
- •2.Форматирование шрифта.
- •3. Списки.
- •3. Цветовая схема, вставка изображений, гиперссылок и таблиц
- •3.1. Атрибуты задания цветовой схемы (цвета фона, текста и гиперссылок).
- •3.2Вставка изображений.
- •3.3. Таблицы.
3.2Вставка изображений.
Для размещения на Web-страницах используются графические файлы форматов GIF, JPEG и PNG
Изображения помещаются на Web-страницу тэгом IMG с атрибутом SRC, сообщающим браузеру имя и местоположение графического файла.
<IMG SRC="image_name">
Если рядом с изображением не должно быть текста, ее размещают внутри отдельного абзаца. Выравнивание рисунка по горизонтали в этом случае задают в тэге <Р>. К изображению атрибутом <ALT> можно добавить название, которое появляется на экран или вместо иллюстрации (если по какой-либо причине графика не выводится в окне браузера), или в качестве всплывающий строки, при указании на рисунок мышью.
В тэге IMG с помощью атрибутов WIDTH (ширина) и HEIGHT (высота) можно указать размер выводимой картинки (в пикселах).
Атрибут ALIGN выравнивает текст по верхнему краю, середине или нижнему краю изображения, справа или слева от него с помощью значений: top, bottom, middle, left или right.
<IMG
SRC="carsk.gif"
WIDTH="30"
HEIGHT="75"
ALIGH="left">
3.3. Таблицы.
Таблицу формируют несколько различных тэгов. Таблица задается контейнером <TABLE></TABLE>, внутри которого содержится описание структуры таблицы и ее содержания.
Любая таблица состоит из строк, которые задаются контейнером <TR></TR> (Table Row), в который помещается описание ячеек.
Формат ячеек и их содержание помещается в контейнер <TD></TD> (Table Data), а заголовки ячеек в контейнер <ТН></ТН> (Table Header).
Толщина разделительных линий в таблице задается с помощью атрибута BORDER, а для выравнивания информации внутри ячейки по горизонтали применяют атрибут ALIGN,
Пример: Создать таблицу и внести в нее данные о башнях Кремля:
<TABLE border»"1">
<TR>
<ТН>Башня</ТН
<ТН>Год сооружения</ТН>
<ТН>Архитектор</ТН>
<ТН>Высота</ТН>
</TR>
<TR>
<ТО>Спасская</ТО>
<TD align="center">149K/TD>
<TD align="center">П.Соларио</ТО>
<TD align="center">7K/TD>
</TR>
<TR>
<ТО>Беклемишевская</ТО>
<TD align="center">1487</TD>
<TD align="center">M.Руффо</ТЭ> \
<TD align="center">46</TD> 3
</TR>
</TABLE> I
Внесение изменений и дополнений в Web-страницу.
В процессе создания Web-страницы приходится добавлять новые тэги и просматривать получаемый результат, для этого:
1. Активизировать Блокнот с открытой в нем редактируемой Web-страницей. Внести в содержимое страницы необходимые изменения и сохранить новый вариант страницы, выполнив команду меню [Файл- Сохранить].
2. Активизировать браузер с открытым в нем предыдущим вариантом страницы. Щелкнуть по кнопке Обновить. В окне браузера отобразится обновленная Web-страница.
3. Включить мета-тэги в заголовок страницы index htm, присвоив атрибуту CONTENT необходимые значения.
Практическое задание 1. Создание Web-страницы «Первое знакомство с тэгами HTML»
1 Запустить текстовый редактор Блокнот [Пуск - Программы - Стандартные -Блокнот].
2 Ввести HTML-код страницы.
<HTML>
<HEAD>
<TITLE> Первое знакомство с тэгами HTML</TITLE>
</HEAD>
<BODY>
</BODY> </HTML>
3 Ввести команду [Файл - Сохранить]. Файлу Web-страницы присвоить имя page-1.htm.
4 Запустить браузер и открыть созданный файл командой [Файл - Открыть]. В заголовке окна браузера высвечивается Первое знакомство с тэгами HTML. Основная часть окна браузера - пуста.
5. Создать простые информационные части тела файла с различным оформлением шрифта, списков и таблицы.
ЗАДАНИЕ к ЗАЧЕТУ
СОЗДАТЬ веб страницу по выбранной тематике.
На веб странице должны быть:
- название темы
- описание согласно тематике (текст)
- нумерованные и маркированные списки
- рисунки
- таблица
- гиперссылки на тематический сайт