Лабораторная работа №3. Абзац. Выравнивание текста.

by Posted on

Цели:

— Закрепить знание о структуре HTML документа и заголовках.

— Научиться использовать абзацы для разбиения текста.

— Научиться выравнивать текст на странице.

Ход работы

  1. На локальном диске создайте папку Lab_3
  2. Создайте HTML документ содержащий структуру Web-страницы и сохраните его в файле Index.html
  3. В теге <TITLE> укажите свою фамилию
  4. Создайте заголовок 1 уровня с текстом «Листопад»
  5. Задайте заголовку выравнивание по центру с помощью атрибута ALIGN со значением CENTER ( <h1 align=center>)
  6. После заголовка добавьте в документ следующий код
<pre> Лес, точно терем расписной, Лиловый, золотой, багряный, Веселой, пестрою стеной Стоит над светлою поляной. </pre>
  • Сохраните и посмотрите результат в браузере.
  • Задайте странице фон и цвет текста соответствующие осенней тематике.
  • После тега <PRE> </PRE> добавьте заголовок 3 уровня с текстом «Иван Бунин» Выровняйте данный заголовок по правому краю экрана с помощью атрибута align=right.
  • Добавьте разделительную горизонтальную линию с помощью тега <HR>, линия должна быть на всю ширину экрана и толщиной 3 пикселя.
  • Добавьте заголовок 1 уровня с текстом «Золотая осень», выровняйте по центру экрана.
  • После заголовка добавьте код:
<p>    Осень, сказочный чертог, </p>
<p>    Всем открытый для обзора. </p>
<p>    Просеки лесных дорог, </p>
<p>    Заглядевшихся в озера. </p>  
Как на выставке картин: <br>
Залы, залы, залы, залы. <br>
Вязов, ясеней, осин <br>
В позолоте небывалой. <br>
  1. Сохраните и посмотрите результат в браузере.
  2. Добавьте в документ следующий код
<p align=left>
Липы обруч золотой – <br>
Как венец на новобрачной. <br>
Лик березы – под фатой <br>
Подвенечной и прозрачной. <br>
</p>
<p align=center> Погребенная земля <br>
Под листвой в канавах, ямах. <br>
В желтых кленах флигеля, <br>
Словно в золоченных рамах. <br>
</p>
<p align=right>
Где деревья в сентябре<br>
На заре стоят попарно, <br>
И закат на их коре<br>
Оставляет след янтарный<br>
</p>  
  1. Добавьте заголовок 3 уровня с текстом «Борис Пастернак» выровненный по правому краю
  2. Сохраните и проверьте работу в браузере.

Практическое задание.

  1. Создайте файл Index1.html в папке Lab_3
  2. Создайте структуру документа
  3. Оформите стих как представлено в образце
  4. Необходимо оформить данный стих двумя способами

1 способ – с помощью тега <PRE>

2 способ с помощью тега <p> и тега <br>

Имя и фамилию автора оформить тегом заголовка 3 уровня

Оформить страницу добавив цвет фона и цвет текста на свой выбор (текст должен быть читаемым)

Просмотров: 463