. Окончательно контейнер первой строки выглядит так: 



 

   

  

   

 

 

Замечание. Для облегчения набора текста можно сначала вве-

сти  только  первый  контейнер  ,  затем  ско-


 

 

 





пировать  его  три  раза  и  в  копиях  заменить  только  текст  внутри 

контейнера

V. Заполните вторую строку таблицы. Контейнер второй стро-

ки  должен  располагаться  после  контейнера  первой  строки.  С  этой 

строки  начинается  содержание  таблицы,  для  ее  ячеек  используйте 

контейнеры  

.  Первая  и  вторая  ячейки  по  высоте  за-

нимают 3 строки таблицы. Чтобы объединить их, добавьте в их кон-

тейнеры  атрибуты  ROWSPAN=3.  При  наборе  здесь  тоже  удобно 

пользоваться копированием контейнера первой ячейки, а для третьей 

и  четвертой  ячеек  просто  удалить  не  нужный  им  атрибут 

ROWSPAN=3. 

Окончательно  контейнер  второй  строки  выглядит 

так:  



 

    Центральная  

    Пр. Мира, д. 4 

   

  



 

VI.  Заполните  третью  строку  таблицы.  Контейнер  третьей 

строки  должен  располагаться  после  контейнера  второй  строки.  Для 

ячеек по-прежнему используйте контейнеры 

. Первая 

и вторая ячейки входят в объединенные раньше блоки, их объявлять 

не надо. А третья и четвертая ячейки содержат новую информацию. 

Скопируйте контейнеры третьей и четвертой ячеек из второй строки 

и поменяйте в них содержимое. Окончательно контейнер этой строки 

выглядит так:  

 

   

 

 

VII.  Аналогично  п.  VI  создайте  четвертую  строку.  Сохраните 

документ и посмотрите его через Explorer. В таблице пока нет разли-

новки, но, если все сделано правильно, структура расположения ин-

формации должна просматриваться. Если нет – исправляйте ошибки. 

VIII. Добавьте в таблицу сведения о гостинице  «Спортивная». 

Они располагаются в пятой и шестой строках. Похожие строки нахо-

дятся  во  второй  и  третьей  строках  таблицы,  и  теги,  создающие  их, 

уже сформированы. Скопируйте теги из второй и третьей строк соот-



 

 

 



10 

ветственно в контейнеры пятой и шестой строк, замените содержание 

ячеек.  Так  как  здесь  первая  и  вторая  ячейки  по  высоте  занимают 

только 2 строки, поменяйте значение атрибута  ROWSPAN. Получа-

ем для новых строк:  

 

   

=2> Спортивная  

   

=2> Бульвар Профсоюзов, д. 15  

   

> одноместный 

 

 

 

   

 

 

IX.  Добавьте  в  таблицу  сведения  о  гостинице  «Вокзальная». 

Они располагаются в седьмой строке. В ней нет объединения ячеек, 

все  четыре  ячейки  содержат  новую  информацию.  Можно  скопиро-

вать теги второй строки, убрать в них атрибуты ROWSPAN и просто 

заменить информацию в контейнерах ячеек:  



 

   


> Вокзальная  

   

 

   

 

 

Сохраните документ и посмотрите его через Explorer. 

X.  Форматирование  таблицы.  Добавьте  в  тег  

Резюме фио



Pdf көрінісі
бет5/9
Дата13.09.2020
өлшемі433,89 Kb.
#78403
түріУчебно-методическое пособие
1   2   3   4   5   6   7   8   9
, который вкладыва-

ется между тегами  и 

ЛАБОРАТОРНАЯ  РАБОТА № 2 

Создание таблиц в HTML-документах 



Задание  

Создать  HTML-документ,  в  котором  представлены  сведения 

о гостиницах  для  размещения  участников  некоторой  конференции. 

Эти сведения оформить в виде таблицы: 



Характеристики гостиниц 

Название 

Адрес 

Тип номера 



Цена за день 

Центральная 

Пр. Мира, д. 4 

Люкс одномест-

ный 

$150 


Люкс двухмест-

ный 


$250 

Одноместный 

$80 

Спортивная 



Бульвар Профсоюзов, д. 15 

Одноместный 

$50 

Двухместный 



$80 

Вокзальная 

Привокзальная пл., д. 3 

Четырехместный 

$50 

 

Выполнение  

I. Подготовьте бланк для HTML-документа. Для этого следует:  

1) 

выполнить  команду  Пуск 



 

Программы 

 

Стан-


дартные   Блокнот   Файл   Сохранить как…; 

2) 


в  окне  Сохранение  документа  открыть  папку  своей 

группы. В поле Имя ввести Таблица Фамилия.htm (вместо Фами-

лия,  естественно,  должна  стоять  Ваша  фамилия),  нажать  кнопку 

Сохранить.  Если  все  сделано  правильно,  то  в  папке  Вашей  группы 

появится этот файл со значком обозревателя, в противном случае – со 

значком  блокнота.  Тогда  следует  удалить  созданный  файл  и  повто-

рить все снова

3) 


откройте  созданный  файл  и  в  окне  программы 

EXPLORER  выполните  команду  Вид 

 

Просмотр  HTML-кода. 



Программа Explorer откроет созданный Вами блокнот.  


 

 

 



II. Введите в созданный документ стандартные теги: 



 

 

 Таблица ФИО  

 

 

 вставьте скелетные теги таб-

лицы (см. [1] п. 1.10): 

  

 

 

 

   


Характеристики гостиниц 

 



Отформатируйте  заголовок  таблицы  (см.  лабораторную  ра-

боту № 1).  

IV. Заполните первую строку таблицы. Каждую строку табли-

цы следует оформлять внутри контейнера 

. Первая строка содер-

жит  названия  столбцов,  для  ячеек  используйте  контейнеры 



 

… 

 


Название 
 Адрес  


Тип номера 
 Цена за день 
  Название     …  
Люкс одноместный  $150 
 … 


> Люкс двухместный
$250 
$50 


> двухместный 
$80 


> Привокзальная пл., д. 3 


> Четырехместный 
$50 
  атри-

буты  BORDER=3,  WIDTH=70%,  ALIGN=CENTER,  BGCO-

LOR=YELLOW,  BORDERCOLOR=MAROON  (можно  взять  свои 

значения  атрибутов).  Посмотрите  через  Explorer,  как  действуют 



эти 

атрибуты 

на 

вид 

таблицы. 

Добавьте 

атрибут 

CELLSPACING=0

,  потом  измените  его  на  CELLSPACING=10.  По-

смотрите через Explorer, определите, за что отвечает этот атри-

бут. Подробнее см. [1] п. 1.10 и Приложение. 

XI. Форматирование ячеек. Выделите сведения, относящиеся к 

разным  гостиницам,  разной  заливкой.  Выровняйте  по  центру  ячеек 

цены номеров. Необходимые для этого сведения – в [1] п. 1.10 и При-

ложении. 



 

 

 



11 



Достарыңызбен бөлісу:
1   2   3   4   5   6   7   8   9




©www.engime.org 2024
әкімшілігінің қараңыз

    Басты бет