Добавить материал и получить бесплатное свидетельство о публикации в СМИ
Эл. №ФС77-60625 от 20.01.2015

Опубликуйте свой материал в официальном Печатном сборнике методических разработок проекта «Инфоурок»

(с присвоением ISBN)

Выберите любой материал на Вашем учительском сайте или загрузите новый

Оформите заявку на публикацию в сборник(займет не более 3 минут)

+

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

Инфоурок / Информатика / Презентации / Презентация по Web программированию на тему "Таблицы в HTML"
ВНИМАНИЮ ВСЕХ УЧИТЕЛЕЙ: согласно Федеральному закону № 313-ФЗ все педагоги должны пройти обучение навыкам оказания первой помощи.

Дистанционный курс "Оказание первой помощи детям и взрослым" от проекта "Инфоурок" даёт Вам возможность привести свои знания в соответствие с требованиями закона и получить удостоверение о повышении квалификации установленного образца (180 часов). Начало обучения новой группы: 24 мая.

Подать заявку на курс
  • Информатика

Презентация по Web программированию на тему "Таблицы в HTML"

библиотека
материалов
Таблицы Для создания таблиц в языке HTML используются следующие элементы: TAB...
Элемент TABLE В языке HTML для создания таблиц служит элемент TABLE. Весь код...
Атрибуты элемента TABLE: border - ширина рамки вокруг всей таблицы, например...
Атрибуты caption Align=left| center| right Valign=top| bootom
Атрибуты  Bgcolor=#xxxxxx Backgroung=“имя_а.jpg”- Align=left|center|right Val...
ОБЫЧНАЯ ТАБЛИЦА 3X2
ДВА ПРИМЕРА С ROWSPAN
 ПРИМЕР С COLSPAN
ДЕМОНСТРАЦИЯ ЗАГОЛОВКОВ ()
ДЕМОНСТРАЦИЯ COLSPAN И ЗАГОЛОВКОВ
ДЕМОНСТРАЦИЯ МНОЖЕСТВЕННЫХ ЗАГОЛОВКОВ, COLSPAN
 ДЕМОНСТРАЦИЯ БОКОВЫХ ЗАГОЛОВКОВ
 ДЕМОНСТРАЦИЯ БОКОВЫХ ЗАГОЛОВКОВ, ROWSPAN
 ИСПОЛЬЗОВАНИЕ ROWSPAN/COLSPAN
 ВЫРАВНИВАНИЕ, ОТСТУПЫ, РАМКИ ТАБЛИЦА БЕЗ РАМКИ
 ТАБЛИЦА С РАМКОЙ ШИРИНОЙ 10
CELLPADDING И CELLSPACING
CELLPADDING И CELLSPACING
CELLPADDING И CELLSPACING
CELLPADDING И CELLSPACING
 ВЫРАВНИВАНИЕ, ЗАГОЛОВКИ И ПОДТАБЛИЦЫ ALIGN=LEFT|RIGHT|CENTER
 VALIGN=TOP|BOTTOM|MIDDLE может применяться к отдельным ячейкам или всей строке
CAPTION=TOP|BOTTOM
CAPTION=TOP|BOTTOM
 ЗАДАНИЕ ШИРИНЫ ТАБЛИЦЫ ШИРИНА 50%
ЗАДАНИЕ ШИРИНЫ ТАБЛИЦЫ ШИРИНА 100%
 ЦЕНТРИРОВАНИЕ ТАБЛИЦЫ НА СТРАНИЦЕ
HEIGHT=15%
Задание
ТАБЛИЦА     Программирование в компьютерных системах Бухгалтера  базовый уров...
30 1

Описание презентации по отдельным слайдам:

№ слайда 1 Таблицы Для создания таблиц в языке HTML используются следующие элементы: TAB
Описание слайда:

Таблицы Для создания таблиц в языке HTML используются следующие элементы: TABLE - создаёт таблицу. CAPTION - задаёт заголовок для таблицы. TR - задаёт строку таблицы. TH - задаёт ячейку таблицы, заголовок столбца. TD - задаёт простую ячейку таблицы с данными.

№ слайда 2 Элемент TABLE В языке HTML для создания таблиц служит элемент TABLE. Весь код
Описание слайда:

Элемент TABLE В языке HTML для создания таблиц служит элемент TABLE. Весь код таблицы должен располагаться между тегами <TABLE> и </TABLE>. Атрибуты этого элемента задают параметры для всей таблицы целиком.

№ слайда 3 Атрибуты элемента TABLE: border - ширина рамки вокруг всей таблицы, например
Описание слайда:

Атрибуты элемента TABLE: border - ширина рамки вокруг всей таблицы, например border=1 bgcolor - определяет цвет фона ячеек таблицы, например bgcolor="yellow“ background - позволяет заполнить фон таблицы рисунком. В качестве значения необходимо указать URL рисунка, например background=“images/foto.jpg” bordercolordark определяет тёмный цвет рамки (тень для объёмной)bordercolordark="black" bordercolor - Определяет цвет рамки (светлый цвет для объёмной) bordercolor="blue“

№ слайда 4 Атрибуты caption Align=left| center| right Valign=top| bootom
Описание слайда:

Атрибуты caption Align=left| center| right Valign=top| bootom

№ слайда 5 Атрибуты  Bgcolor=#xxxxxx Backgroung=“имя_а.jpg”- Align=left|center|right Val
Описание слайда:

Атрибуты <tr><th><td> Bgcolor=#xxxxxx Backgroung=“имя_а.jpg”- Align=left|center|right Valign=top|midlle|bottom Для <th><td> Colspan=n Rowspan=n

№ слайда 6 ОБЫЧНАЯ ТАБЛИЦА 3X2
Описание слайда:

ОБЫЧНАЯ ТАБЛИЦА 3X2

№ слайда 7 ДВА ПРИМЕРА С ROWSPAN
Описание слайда:

ДВА ПРИМЕРА С ROWSPAN

№ слайда 8  ПРИМЕР С COLSPAN
Описание слайда:

ПРИМЕР С COLSPAN

№ слайда 9 ДЕМОНСТРАЦИЯ ЗАГОЛОВКОВ ()
Описание слайда:

ДЕМОНСТРАЦИЯ ЗАГОЛОВКОВ (<TH>)

№ слайда 10 ДЕМОНСТРАЦИЯ COLSPAN И ЗАГОЛОВКОВ
Описание слайда:

ДЕМОНСТРАЦИЯ COLSPAN И ЗАГОЛОВКОВ

№ слайда 11 ДЕМОНСТРАЦИЯ МНОЖЕСТВЕННЫХ ЗАГОЛОВКОВ, COLSPAN
Описание слайда:

ДЕМОНСТРАЦИЯ МНОЖЕСТВЕННЫХ ЗАГОЛОВКОВ, COLSPAN

№ слайда 12  ДЕМОНСТРАЦИЯ БОКОВЫХ ЗАГОЛОВКОВ
Описание слайда:

ДЕМОНСТРАЦИЯ БОКОВЫХ ЗАГОЛОВКОВ

№ слайда 13  ДЕМОНСТРАЦИЯ БОКОВЫХ ЗАГОЛОВКОВ, ROWSPAN
Описание слайда:

ДЕМОНСТРАЦИЯ БОКОВЫХ ЗАГОЛОВКОВ, ROWSPAN

№ слайда 14  ИСПОЛЬЗОВАНИЕ ROWSPAN/COLSPAN
Описание слайда:

ИСПОЛЬЗОВАНИЕ ROWSPAN/COLSPAN

№ слайда 15  ВЫРАВНИВАНИЕ, ОТСТУПЫ, РАМКИ ТАБЛИЦА БЕЗ РАМКИ
Описание слайда:

ВЫРАВНИВАНИЕ, ОТСТУПЫ, РАМКИ ТАБЛИЦА БЕЗ РАМКИ

№ слайда 16  ТАБЛИЦА С РАМКОЙ ШИРИНОЙ 10
Описание слайда:

ТАБЛИЦА С РАМКОЙ ШИРИНОЙ 10

№ слайда 17 CELLPADDING И CELLSPACING
Описание слайда:

CELLPADDING И CELLSPACING

№ слайда 18 CELLPADDING И CELLSPACING
Описание слайда:

CELLPADDING И CELLSPACING

№ слайда 19 CELLPADDING И CELLSPACING
Описание слайда:

CELLPADDING И CELLSPACING

№ слайда 20 CELLPADDING И CELLSPACING
Описание слайда:

CELLPADDING И CELLSPACING

№ слайда 21  ВЫРАВНИВАНИЕ, ЗАГОЛОВКИ И ПОДТАБЛИЦЫ ALIGN=LEFT|RIGHT|CENTER
Описание слайда:

ВЫРАВНИВАНИЕ, ЗАГОЛОВКИ И ПОДТАБЛИЦЫ ALIGN=LEFT|RIGHT|CENTER

№ слайда 22  VALIGN=TOP|BOTTOM|MIDDLE может применяться к отдельным ячейкам или всей строке
Описание слайда:

VALIGN=TOP|BOTTOM|MIDDLE может применяться к отдельным ячейкам или всей строке

№ слайда 23 CAPTION=TOP|BOTTOM
Описание слайда:

CAPTION=TOP|BOTTOM

№ слайда 24 CAPTION=TOP|BOTTOM
Описание слайда:

CAPTION=TOP|BOTTOM

№ слайда 25  ЗАДАНИЕ ШИРИНЫ ТАБЛИЦЫ ШИРИНА 50%
Описание слайда:

ЗАДАНИЕ ШИРИНЫ ТАБЛИЦЫ ШИРИНА 50%

№ слайда 26 ЗАДАНИЕ ШИРИНЫ ТАБЛИЦЫ ШИРИНА 100%
Описание слайда:

ЗАДАНИЕ ШИРИНЫ ТАБЛИЦЫ ШИРИНА 100%

№ слайда 27  ЦЕНТРИРОВАНИЕ ТАБЛИЦЫ НА СТРАНИЦЕ
Описание слайда:

ЦЕНТРИРОВАНИЕ ТАБЛИЦЫ НА СТРАНИЦЕ

№ слайда 28 HEIGHT=15%
Описание слайда:

HEIGHT=15%

№ слайда 29 Задание
Описание слайда:

Задание

№ слайда 30 ТАБЛИЦА     Программирование в компьютерных системах Бухгалтера  базовый уров
Описание слайда:

<HTML><HEAD><TITLE>ТАБЛИЦА </TITLE></HEAD> <BODY> <CENTER><TABLE width=50% BORDER=1 cellspacing=0 CELLpadding=20> <TR BGCOLOR=#28421f> <TH COLSPAN=2><font color=#ffffff>Программирование в компьютерных системах</font></TH> <TH><font color=#ffffff>Бухгалтера</font></TH></tr> <TR bgcolor=#86992d> <TH align=center>базовый уровень</TH> <TH>повышенный уровень</TH><TH>базовый уровень</TH></TR> <TR bgcolor=#b9cc5f> <TD align=center>Техник-программист</TD> <TD>Программист</TD><TD>Бухгалтер</TD></TR> </table> </BODY></HTML>

Краткое описание документа:

Элемент 

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

. Внутри допустимо использовать следующие элементы: , , , ,  и .


Атрибуты элемента TABLE:

border - ширина рамки вокруг всей таблицы, например border=1

bgcolor - определяет цвет фона ячеек таблицы, например bgcolor="yellow“

background - позволяет заполнить фон таблицы рисунком. В качестве значения необходимо указать URL рисунка, например background=“images/foto.jpg”

 bordercolordark определяет тёмный цвет рамки (тень для объёмной)bordercolordark="black"

bordercolor - Определяет цвет рамки (светлый цвет для объёмной) bordercolor="blue“

 

 

 

 

скачать материал

02.02.2015 | Информатика | Презентации | Просмотров: 3 | свидетельство о публикацииГиперссылками (или просто ссылками) называют выделенные области документа, позволяющие перейти к другой его части или к другому документу в Сети. Гиперссылка состоит из "внутренней" части, то есть, адреса документа, на который она ссылается, и "вне...

Гиперссылками (или просто ссылками) называют выделенные области документа, позволяющие перейти к другой его части или к другому документу в Сети.

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

Опция TARGET может быть не указана, в этом случае документ открывается в текущем окне браузера, или указана в виде TARGET="_BLANK">, тогда документ открывается в новом окне. Текст ссылки внутри тага может быть любым. Точно так же в таг можно поместить и изображение.

 

Для создания гиперссылки служит таг вида
текст ссылки


скачать материал

02.02.2015 | Информатика | Конспекты | Просмотров: 4 | свидетельство о публикацииТема 1.3.  Тэги списков Цель: Научить студентов создавать различные виды списков в HTML-документах Существует три основных вида списков в HTML-документе: ·             ...

Тема 1.3.  Тэги списков

Цель: Научить студентов создавать различные виды списков в HTML-документах

Существует три основных вида списков в HTML-документе:

·                    пронуменрованный

·                    непронуменрованный

·                    список описаний

 

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

Нумерованные списки

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

Пронумерованный список начинается стартовым тэгом

  1. и завершается тэгом

. Каждый элемент списка начинается с тэга

  • . Например:


     



    1. Программирование
    2. Алгоритмизация
    3. Проектирование
     



скачать материал
Достижения

Здесь Вы можете добавлять свои достижения

+ Добавить новое достижениеСертификат №100910, подтверждающий, что Шаваева Лара Сагатгериевна
создал(а) личный учительский сайт.Посмотреть


#page-content { padding-bottom: 65px; } body > footer { height: 65px; } #footer-bottom { background: #278 } Все права защищены © 2014 «Учительский.сайт»

, ,, 


Автор
Дата добавления 02.02.2015
Раздел Информатика
Подраздел Презентации
Просмотров937
Номер материала 360452
Получить свидетельство о публикации

Выберите специальность, которую Вы хотите получить:

Обучение проходит дистанционно на сайте проекта "Инфоурок".
По итогам обучения слушателям выдаются печатные дипломы установленного образца.

ПЕРЕЙТИ В КАТАЛОГ КУРСОВ

Похожие материалы

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