- •Курс: «телекоммуникационные и компьютерные технологии в политической журналистике»
- •Модуль 3.
- •Что такое Web-сайт.
- •Язык создания Web-страниц.
- •Задания для самостоятельной работы.
- •Тестовые вопросы по модулю.
- •Глоссарий.
- •А) Основная литература.
- •Б) Дополнительная литература
- •Модуль 3. Создания Web-сайтов с помощью html-языка. Модульная лекция: мл 3-1.
- •Что такое Web-сайт.
- •Этапы проектирования и создания Web-сайта
- •2. Язык создания Web-страниц.
- •Модульная лекция: мл 3-2
- •2.1. Структура html- документа.
- •2.2. Элемент body и его параметры.
- •2. 3. Тэги форматирования текста.
- •Элемент font
- •Модульная лекция: мл 3-3
- •2.4. Преформатированный текст - тэг pre.
- •2.5. Заголовки - элементы h1,h2,h3,h4,h5,h6
- •2.6. Создание списков.
- •2.6.1. Упорядоченные (нумерованные) списки
- •2.6.2. Неупорядоченные списки
- •2.6.3. Маркированные списки.
- •2.6.4. Вложенные списки.
- •2.6.5. Списки определений
- •Модульная лекция: мл 3-4
- •2.7. Использование звуковых файлов.
- •2.7. 1. Воспроизведение файлов формата мрз
- •.2.8. Навигация по html-документам.
- •2.8. 1. Внутренняя навигация - по страницам html-документа.
- •Модульная лекция: мл 3-5.
- •2.9. Создание таблиц.
- •Модульная лекция: мл 3-6.
- •2.10. Создание форм. Элементы формы.
- •Элемент textarea
- •Модульная лекция: мл 3-7.
- •2.11. Создание фреймов.
- •Модульная лекция: мл 3-8
- •2.12. Создание таблицы стилей - css.
- •2.12. 1.Формирование листа стилей
- •2.12.2. Что такое css ?
- •Модульная лекция: мл 3-9
- •2.12.3. Чем css отличается от html ?
- •2.12.4. Синтаксис и принцип работы css.
- •2.12.5. Типы селекторов в css
- •Модульная лекция: мл 3-10
- •2.12.6. Использование стилей внутри тэга.
- •Регистрация Web-сайта в Интернете
- •Загрузка новых файлов на сервер.
- •5. Задания для самостоятельной работы.
- •6. Тесты для промежуточного контроля.
- •7. Глоссарий.
2.2. Элемент body и его параметры.
Данный элемент содержит собственно тело (текст) документа. В теле документа может содержаться достаточно большой набор элементов. Ключевые атрибуты данного элемента - bgcolor, text, link, vlink и alink - могут использоваться для того, чтобы задать фоновое изображение, дополнительный цвет фона и цвет, который будет использоваться при вывода на экран обычного текста и гипертекстовых связей.
Пример <body параметр1=значение1,параметр2=значение2...>
текст документ
</body> Список параметров:
bgcolor - определяет цвет фона для тела документа. См. ниже синтаксис для кодировки таких цветов.
text - определяет цвет, используемый при выводе на экран текста из данного документа. Обычно используется, когда Вы меняете фоновый цвет с помощью атрибутов bgcolor или backround.
link - оределяет цвет, который будет использоваться при выводе на экран
текста из еще не выбранных вами гипертекстовых связей
vlink - оределяет цвет, который будет использоваться при выводе на экран
текста из уже проверенных вами гипертекстовых связей
alink - задает цвет, которым будут выделяться в тексте гипертекстовые связки
в тот момент, когда пользователь щелкает по ним клавишей мыши
background - определяет адрес URL, откуда будет браться изображение для
фона текущего документа.
В языке html цвета задаются по схеме RGB (R – доля красного цвета, G –доля зеленого цвета, B – доля синего цвета) шестнадцатеричными числами (например как color="#C0FFC0"), либо одним из 16 общепринятых названий для цвета.
Примеры использования цветов в параметре тэга body.
1. <body bgcolor=white text=black link=red vlink=maroon alink=fuschia>
2. <body background="face.jpg">
В первом случае в качестве фона документа выбран белый цвет, а для текста – черный.
Во втором случае в качестве фона документа выбран рисунок с названием face.jpg. Если размер рисунка меньше размера экрана, то он повторяется на весь экран.
2. 3. Тэги форматирования текста.
Множество тэгов html-языка можно объединить в группы по функциональному назначению. Рассмотрим на примерах использование этих групп тэгов.
Теги выделения текста
Тег |
Описание |
<B>текст</B> |
Текст отображается полужирным. |
<BIG>текст</BIG> |
Текст отображается шрифтом увеличенного размера. |
<i>текст</i> |
Текст отображается курсивом. |
<S>текст</S> |
|
<SMALL>текст</SMALL> |
Текст отображается шрифтом уменьшенного размера. |
<TT>текст</TT> |
Текст отображается моноширинным шрифтом. |
<U>текст</U> |
Подчеркнутый текст. |
X<SUB>i</SUB> |
Xi - для отображения подстрочных индексов. |
A<SUP>x</SUP> |
Ax - для отображения надстрочных индексов. |
Так как браузер не воспринимает нажатие на клавишу Enter как переход на следующую строку, необходимо использовать тэг br, который завершает текущую строку и переходит на следующую.Для того, чтобы новая строка начиналась после изображения, в тэге br может использоваться атрибут clear.
Например:
<br clear=left> - новая строка начинается после изображений, размещенных слева
<br clear=right> - новая строка начинается после изображений, размещенных справа
<br clear=all> - новая строка начинается ниже всех изображений