МегаПредмет

ПОЗНАВАТЕЛЬНОЕ

Сила воли ведет к действию, а позитивные действия формируют позитивное отношение


Как определить диапазон голоса - ваш вокал


Игровые автоматы с быстрым выводом


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


Целительная привычка


Как самому избавиться от обидчивости


Противоречивые взгляды на качества, присущие мужчинам


Тренинг уверенности в себе


Вкуснейший "Салат из свеклы с чесноком"


Натюрморт и его изобразительные возможности


Применение, как принимать мумие? Мумие для волос, лица, при переломах, при кровотечении и т.д.


Как научиться брать на себя ответственность


Зачем нужны границы в отношениях с детьми?


Световозвращающие элементы на детской одежде


Как победить свой возраст? Восемь уникальных способов, которые помогут достичь долголетия


Как слышать голос Бога


Классификация ожирения по ИМТ (ВОЗ)


Глава 3. Завет мужчины с женщиной


Оси и плоскости тела человека


Оси и плоскости тела человека - Тело человека состоит из определенных топографических частей и участков, в которых расположены органы, мышцы, сосуды, нервы и т.д.


Отёска стен и прирубка косяков Отёска стен и прирубка косяков - Когда на доме не достаёт окон и дверей, красивое высокое крыльцо ещё только в воображении, приходится подниматься с улицы в дом по трапу.


Дифференциальные уравнения второго порядка (модель рынка с прогнозируемыми ценами) Дифференциальные уравнения второго порядка (модель рынка с прогнозируемыми ценами) - В простых моделях рынка спрос и предложение обычно полагают зависящими только от текущей цены на товар.

Размещение таблиц на html-странице. Объединение ячеек таблицы





Лабораторная работа

Размещение таблиц на html-странице. Форматирование текста в таблице

Изучение тэгов <table>, <tr>,<td>,<th>

Тег <table>

Описание

Элемент <table> служит контейнером для элементов, определяющих содержимое таблицы.

Любая таблица состоит из строк и ячеек, которые задаются с помощью тегов <tr> и <td>.

Внутри <table> допустимо использовать следующие элементы: <caption>, <col>, <colgroup>, <tbody>, <td>, <tfoot>, <th>, <thead> и <tr>.

Синтаксис

<table> <tr> <td>...</td> </tr></table>

Атрибуты

Align - Определяет выравнивание таблицы.

background - Задает фоновый рисунок в таблице.

Bgcolor - Цвет фона таблицы.

Border - Толщина рамки в пикселах.

Bordercolor - Цвет рамки.

Cellpadding - Отступ от рамки до содержимого ячейки.

Cellspacing - Расстояние между ячейками.

Cols - Число колонок в таблице.

Frame - Сообщает браузеру, как отображать границы вокруг таблицы.

Height - Высота таблицы.

Rules - Сообщает браузеру, где отображать границы между ячейками.

Summary - Краткое описание таблицы.

Width - Ширина таблицы.

Тег <td>

Описание

Предназначен для создания одной ячейки таблицы. Тег <td> должен размещаться внутри контейнера <tr>, который в свою очередь располагается внутри тега <table>.

Атрибуты

Abbr - Краткое описание содержимого ячейки.

Align - Определяет выравнивание содержимого ячейки по горизонтали.

Axis - Группирует ячейки связанные между собой похожей информацией.

background - Задает фоновый рисунок в ячейке.

Bgcolor - Цвет фона ячейки.

Bordercolor - Цвет рамки.

Char - Выравнивает содержимое ячейки по заданному символу.

Charoff - Смещает содержимое ячейки относительно заданного символа.

Colspan - Объединяет горизонтальные ячейки.

Headers - Позволяет связать ячейки с заголовком.

Height - Высота ячейки.

Nowrap - Запрещает перенос строк.

Rowspan - Объединяет вертикальные ячейки.

Scope - Позволяет связать ячейки простой таблицы с заголовками в речевых браузерах.

Valign - Выравнивание содержимого ячейки по вертикали.

Width - Ширина ячейки.

1. Откройте приложение Блокнот

2. Создайте новую HTML-страницу.

3. Создайте новую Web-страницу. Разместите на странице таблицу.
Ширина таблицы = 90%, высота = 600 пикселей.
Высота рядов = 200 пикселей.
Ширина колонок = 30%

<!—Пример создания таблицы с одной строкой -->

<table width="90%" height="600px" border="1">

<tr height="200px">

<td width="30%">1 - я колонка</td>

<td width="30%">2 - я колонка</td>

<td width="30%">2 - я колонка</td>

</tr>

</table>

4. Выполните форматирование текста в таблице, как показано в примере 3.1

Пример 3.1:

В таблице могут использоваться следующие способы выравнивания:

По горизонтали: - слева; По вертикали: - вверху. По горизонтали: - слева; По вертикали: - по центру. (этот способ используется по умолчанию) По горизонтали: - слева; По вертикали: - внизу.
По горизонтали: - по центру; По вертикали: - вверху. По горизонтали: - по центру; По вертикали: - по центру. По горизонтали: - по центру; По вертикали: - внизу.
По горизонтали: - справа; По вертикали: - вверху. По горизонтали: - справа; По вертикали: - по центру. По горизонтали: - справа; По вертикали: - внизу.

5. Сохраните страницу в личной папке в файл table1.html



Размещение таблиц на html-странице. Форматирование ячеек таблицы

1. Откройте приложение Блокнот

2. Создайте новую HTML-страницу.

3. Создайте новую Web-страницу. Разместите на странице таблицу.
Выровняйте таблицу по центру страницы.
Цвет заднего фона таблицы = "#E2E2E2".
Ширина таблицы = 500 пикселей.
Расстояние между границей ячейки и ее содержимым = 15 пикселей.
Толщина границы = 5 пикселей, цвет границы = "#008000
Цвет второго ряда таблицы = #FFFFCA"
Цвет ячейки 3 = "#FFCACA", цвет ячейки 5 = "#ECFFEC" (см. пример 3.2).

Пример 3.2:

Форматирование заднего фона таблиц, рядов и ячеек:

4. Сохраните страницу в личной папке в файл table2.html

Размещение таблиц на html-странице. Объединение ячеек таблицы

1. Откройте приложение Блокнот

2. Создайте новую HTML-страницу.

3. Создайте новую Web-страницу.
Разместите на странице таблицу из 5 рядов и 5 колонок.
Выполните объединение ячеек таблицы, как показано в примере 3.3.

Пример 3.3:

 

Объединение ячеек таблицы:

     
 
     
     
 
         

4. Сохраните страницу в личной папке в файл table3.html





©2015 www.megapredmet.ru Все права принадлежат авторам размещенных материалов.