Практические работы по HTML

Задание № 1.

Создание простейшего файла HTML

1. Создайте личную папку, куда вы будете сохранять все файлы своего сайта.

2. Нажмите правой кнопкой мыши и выберите «Создать» - «Пустой файл».

3. Введите имя файла rasp.html.

4. Нажмите правой кнопкой мыши «Открыть с помощью» - «Mousepad»

5. Наберите простейший html документ:

Учебный файл HTML

Расписание занятий на среду.

6. Сохраните документ, закройте редактор.

7. Откройте документ rasp.html двойным щелчком мыши, и проверьте результат.

Задание № 2.

Управление расположением текста на экране

1. Выполните шаг №4 из предыдущего задания, для файла rasp.html

2. Внести изменения в файл rasp.html, расположив слова Расписание, занятий, на среду на разных строках.

Пример:

Расписание

занятий

на среду.

3. Сохраните текст с внесенными изменениями в файле rasp.html.

4. Откройте документ rasp.html двойным щелчком мыши, и проверьте результат.

Не удивляйтесь тому, что внешний вид вашей Web-страницы не изменился.

Задание № 3.

Управление расположением текста на экране 2

1. Выполните шаг №4 из первого задания, для файла rasp.html

2. Внести изменения в файл rasp.html:

Пример:

Расписание

занятий

на среду.

3. Сохраните текст с внесенными изменениями в файле rasp.html.

4. Откройте документ rasp.html двойным щелчком мыши, и проверьте результат.

Внешний вид строк должен поменяться. Отчего зависит изменение текста?

Задание № 4.

Форматирование текста

Тег перевода строки

отделяет строку от последующего текста или графики.

Тег абзаца

тоже отделяет строку, но еще добавляет пустую строку, которая зрительно

выделяет абзац.

1. Внесите изменения в файл RASP.HTML

Учебный файл HTML

Расписание

занятий

на среду.

3. Сохраните текст с внесенными изменениями в файле rasp.html.

4. Откройте документ rasp.html двойным щелчком мыши, и проверьте результат.

Задание № 5.

Форматирование текста

1. Внесите изменения в файл RASP.HTML

Учебный файл HTML

Расписание

занятий

на среду.

3. Сохраните текст с внесенными изменениями в файле rasp.html.

4. Откройте документ rasp.html двойным щелчком мыши, и проверьте результат.

5. Ответьте на вопрос, с помощью каких тегов задается подчеркнутый, курсив, полужирный шрифт?

Задание № 6.

Задание размеров символов Web-страницы

Существует два способа управления размером текста, отображаемого браузером:

• использование стилей заголовка,

• задание размера шрифта основного документа или размера текущего шрифта.

Используется шесть тегов заголовков: от

до

(тег двойной, т.е. требует закрытия).

Каждому тегу соответствует конкретный стиль, заданный параметрами настройки браузера.

1. Внесите изменения в файл RASP.HTML

Учебный файл HTML

Расписание занятий

на среду.

3. Сохраните текст с внесенными изменениями в файле rasp.html.

4. Откройте документ rasp.html двойным щелчком мыши, и проверьте результат.

5. Замените тег h1 на h2-h6, и посмотрите как меняется размер загаловка.

Задание № 7.

Установка размера текущего шрифта

Тег шрифта позволяет задавать размер текущего шрифта в отдельных местах текста в

диапазоне от 1 до 7.

1. Внесите изменения в файл RASP.HTML

Учебный файл HTML

Расписание занятий

на среду.

3. Сохраните текст с внесенными изменениями в файле rasp.html.

4. Откройте документ rasp.html двойным щелчком мыши, и проверьте результат.

5. Замените размер шрифта на другие, и посмотрите как меняется размер текста.

Задание № 8.

Установка цвета шрифта

Тег предоставляет возможности управления гарнитурой, цветом и размером текста.

Для изменения цвета шрифта можно использовать в теге атрибут COLOR="X". Вместо

"X" надо подставить английское название цвета в кавычках (" "), либо его шестнадцатеричное

значение. При задании цвета шестнадцатеричным числом необходимо представить этот цвет

разложенным на три составляющие: красную (R - Red), зелѐную (G - Green), синюю (B - blue),

каждая из которых имеет значение от 00 до FF. В этом случае мы имеем дело с так называемым

форматом RGB.

Примеры записи текста в формате RGB приведены в Таблице 1:

1. Внесите изменения в файл RASP.HTML

Учебный файл HTML

Расписание

занятий на среду.

3. Сохраните текст с внесенными изменениями в файле rasp.html.

4. Откройте документ rasp.html двойным щелчком мыши, и проверьте результат.

5. Поменяйте цвет на другой, и посмотрите результат работы тега font.

Задание № 9.

Выравнивание текста по горизонтали.

Выравнивание текста определяет его внешний вид и ориентацию краев абзаца и может выполняться по левому краю, правому краю, по центру или по ширине. Для установки выравнивания текста обычно используется тег абзацас атрибутом align, который определяет способ выравнивания. Атрибут align может принимать значения: left, right, center, justify выравнивание по левому краю, правому краю, по центру и ширине соответственно.

1. Внесите изменения в файл RASP.HTML

Учебный файл HTML

Расписание

занятий на среду.

3. Сохраните текст с внесенными изменениями в файле rasp.html.

4. Откройте документ rasp.html двойным щелчком мыши, и проверьте результат.

Сделайте Web-страницу по следующему образцу.

В скобочках указан цвет текста. Обязательно должно присутствовать выравнивание текста.

Файлу дайте название biscuit.html