ЛАБОРАТОРНЫЙ ПРАКТИКУМ ПО HTML
Л/р №1: Структура HTML документа. Дескрипторы.
Л/р №2: Форматирование текста. Графика в HTML.
Л/р №3: Списки и таблицы.
Л/р №4: Гиперсвязи и фреймы.
Л/р №5: Технология CSS.
Зачетная лабораторная работа.
СПРАВОЧНАЯ ИНФОРМАЦИЯ
Копирование текста
Таблица цветов
Словарь HTML
Свойства CSS
РЕКОМЕНДУЕМЫЕ РЕСУРСЫ
Справочник по HTML и CSS. Для тех, кто делает сайты
PHP: Простой учебник - Manual
Профессиональные бесплат-ные шаблоны HTML и CSS
Яндекс.Вебмастер - проверка орфографии сайта
Адвего - проверка орфографии сайта
Поиск для сайта Яндекс
Поиск для сайта Google
Яндекс: «Поделиться» в соцсетях
Плагины JavaScript jQuery UI
Слайд-плагин Highslide JS/jQuery
Слайд-плагин Fancybox JS/jQuery
Слайд-плагин Lightbox JS/jQuery
"Кремлёвская" JS-утилита Masha
JS/jQuery утилита Flot для построения графиков
Л/р №3 Списки и таблицы
В HTML предусмотрены дескрипторы, позволяющие включать в текст списки различных типов и таблицы. Мы ограничимся рассмотрением наиболее часто используемых списков - нумерованных и ненумерованных, для таблиц рассмотрим наиболее существенные атрибуты. Более полную информацию о списках и таблицах можно почерпнуть в справочниках или стандартах HTML.
Нумерованные списки
Нумерованный список определяется парой дескрипторов <OL>...</OL>, элементы списка маркируются одиночным дескриптором <LI>
Из атрибутов дескриптора <OL> рассмотрим атрибут TYPE, который позволяет задать способ нумерации элементов списка
- TYPE="1" Нумерация арабскими цифрами, этот способ нумерации используется по умолчанию, если атрибут TYPE не указан явно;
- TYPE="I" Нумерация большими римскими цифрами;
- TYPE="i" Нумерация малыми римскими цифрами;
- TYPE="A" Нумерация большими латинскими буквами;
- TYPE="a" Нумерация малыми латинскими буквами;
Поэкспериментируйте, задавая разные способы нумерации.
Ненумерованные списки
Ненумерованный список определяется парой дескрипторов <UL>...</UL>, элементы списка маркируются одиночным дескриптором <LI>
Из атрибутов дескриптора <UL> рассмотрим атрибут TYPE, который задает вид начального символа элемента списка. Обратите внимание, что значение типа задается малыми буквами (для Internet Explorer)
- TYPE="disk" Список начинается маленьким закрашенным кружочком;
- TYPE="circle" Список начинается маленьким незакрашенным кружочком;
- TYPE="square"Список начинается маленьким закрашенным квадратиком;
Поэкспериментируйте, задавая разные начальные символы для элементов списка.
Таблицы
Таблицы в HTML состоят из строк, которые, в свою очередь делятся на ячейки. Все содержимое таблицы заключается между парой дескрипторов <TABLE>...</TABLE>, для задания толщины линий используется атрибут BORDER, а для указания цвета заполнения рамки - атрибут BORDERCOLOR. Каждая сторка таблицы определяется дескрипторами <TR>...</TR>, а ячейка заключена между дескрипторами <TD>...</TD>. Ячейки, используемые для заголовков столбцов задаются дескрипторами <TH>...</TH>.
Задание 1
В поисковике Google, Яndex и т.д. найдите законы Мерфи (не менее 20) и составьте их нумерованный список на страничке murphy.html по образцу
Задание 2
В поисковике Google, Яndex и т.д. найдите английские пословицы (не менее 10) и составьте из них таблицу на страничке proverbs.html по образцу