Таблицы HTML - документов презентация

Слайд 1
Таблицы HTML - документов


Слайд 2Тэг
- создает таблицу. Все прочие элементы таблицы – текст,

рисунки, списки - должны быть вложенными в него. Допускается также вложение таблиц одна в другую, т.е. содержимым ячейки может быть другая таблица. Закрывающий тэг обязателен

Тэги и

- описывают строки и столбцы (ячейки таблицы).

Тэг

- описывает заголовки в первой строке таблицы.

Тэг

- описывает заголовок таблицы.


Слайд 3Таблицы в HTML


Слайд 4Простейшая таблица


Таблица из одной строки
из трех

столбцов
без указания ширины таблицы
и ячеек.


толщина рамки

TABLE таблица
TR = table row строка таблицы
TD = table data данные таблицы
TH = table header заголовок (жирный, по центру)


Слайд 5Атрибуты для тэга
Align - выравнивание таблицы относительно документа. Возможные

значения: center, left, right
Valign - выравнивает текст в таблице по вертикали. Значения: top, bottom, middle, baseline.
background=“имя файла“ строка, определяющая рисунок для заднего фона таблицы
bgcolor =цвет - определяет задний фон таблицы
border - толщина внешней рамки в пикселях. Если атрибут не указан, то таблица выводится без видимой рамки
bordercolor =цвет - цвет рамки
bordercolorlight =цвет - цвет рамки слева и сверху
bordercolordark =цвет - цвет рамки справа и снизу

Слайд 6Выравнивание


По

центру, по верхней границе
WIDTH=200>По правой границе,
по середине



...

всей таблицы:

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

left,
center,
right

left,
center,
right

top,
middle,
bottom


Слайд 7Атрибуты для тэга
title =“Текст“ - всплывающая подсказка
width = число

- ширина таблицы в процентах или пикселях


height = число - рекомендуемая высота таблицы только в пикселях

cellspacing = число - расстояние между ячейками
cellpadding = число - расстояние между содержимым и рамкой
colls = число - заранее сообщает браузеру количество столбцов в таблице.



Слайд 8Размеры

...

ширина в пикселях или в % от ширины окна

браузера

высота в пикселях


...

всей таблицы:

строки:

ячейки:


ширина в пикселях или в % от ширины таблицы


Слайд 9

src="/6.jpg" >


...



Слайд 10rules - описывает рамки внутри таблицы. Значения:
Атрибуты для тэга


Слайд 11frame - описывает параметры внешней рамки. Значения:
Атрибуты для тэга


Слайд 12Фон и цвет текста


Привет!




Таблица из двух строк
и двух столбцов


цвет фона

фоновый рисунок


Слайд 13Отступы

= white>
1
2


интервал между ячейками

отступ внутри ячеек

CELLSPACING

CELLSPACING

CELLPADDING

CELLPADDING


Слайд 14Объединение ячеек


Привет!


Вася,
Петя,

Маша!









Привет! Вася,
Петя,
Маша!

column span охват столбцов

row span охват строк


Слайд 15Вложенные таблицы

















ВасяПетя
МашаДаша




122
3334444


Слайд 16Добавление заголовка таблицы
Заголовок таблицы можно создать с помощью известных вам тэгов

<Н1>—<Н6>
Но поскольку ширина таблицы может отличаться от ширины окна обозревателя, выровнять текстовый заголовок относительно таблицы может оказаться довольно сложно.

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


Слайд 17Пример создания таблицы с названиями столбцов.

Название таблицы



Заголовок1
Заголовок2
Заголовок3


ячейка таблицы A
ячейка таблицы В
ячейка таблицы С

ячейка таблицы D
ячейка таблицы Е
ячейка таблицы F




Обратная связь

Если не удалось найти и скачать презентацию, Вы можете заказать его на нашем сайте. Мы постараемся найти нужный Вам материал и отправим по электронной почте. Не стесняйтесь обращаться к нам, если у вас возникли вопросы или пожелания:

Email: Нажмите что бы посмотреть 

Что такое ThePresentation.ru?

Это сайт презентаций, докладов, проектов, шаблонов в формате PowerPoint. Мы помогаем школьникам, студентам, учителям, преподавателям хранить и обмениваться учебными материалами с другими пользователями.


Для правообладателей

Яндекс.Метрика