<metakeywords>Информатика, класс, урок, на тему, 10 класс, Создание таблиц. Часть 2.</metakeywords>
<metakeywords>Информатика, класс, урок, на тему, 10 класс, Создание таблиц. Часть 2.</metakeywords>
-
==Тема==
+
== Тема ==
-
*'''Создание таблиц. Часть 2.'''
+
-
==Цель==
+
*'''Создание таблиц. Часть 2.'''
-
*Научить растягивать и добавлять отдельные ячейки таблицы и регулировать расстояние между ними.
+
-
==Ход урока==
+
== Цель ==
-
Продолжим изучени таблиц. В этот раз задача состоит в том, чтобы растянуть ячейку 1х1 на два столбца. Пример показан на рисунке внизу:
+
*Научить растягивать и добавлять отдельные [[Стаття на тему: Внесення формул і функцій у комірки. Абсолютна та відносна адресація|ячейки]] таблицы и регулировать расстояние между ними.
+
== Ход урока ==
-
[[Image:Tbl1.jpg|400px|Таблица]]
+
Продолжим изучени таблиц. В этот раз задача состоит в том, чтобы растянуть ячейку 1х1 на два столбца. Пример показан на рисунке внизу:
+
<br> [[Image:Tbl1.jpg|400px|Таблица]]
-
Сейчас самое время вспомнить о таких атрибутах как:
+
<br> Сейчас самое время вспомнить о таких атрибутах как:
-
*'''COLSPAN''' - определяет количество столбцов, на которые растягивается нужная ячейка
+
*'''COLSPAN''' - определяет количество [[Практическая работа: Табличный процессор Microsoft Excel. Основные понятия. Ввод данных в таблицу|столбцов]], на которые растягивается нужная ячейка
*'''ROWSPAN''' – задает количество рядов, на которые растягиваться ячейка.
*'''ROWSPAN''' – задает количество рядов, на которые растягиваться ячейка.
Строка 52:
Строка 52:
И еще нам не нужно было прописывать ячейку 1х3.
И еще нам не нужно было прописывать ячейку 1х3.
-
А если бы она осталась в коде, то вот что вышло бы:
+
А если бы она осталась в [[Кодирование|коде]], то вот что вышло бы:
+
<br> [[Image:Tbl2.jpg|400px|Таблица]]
-
[[Image:Tbl2.jpg|400px|Таблица]]
+
<br> Теперь разберемся с параметром параметром '''ROWSPAN'''. Принцип действия тут точной такой же:
-
+
-
+
-
Теперь разберемся с параметром параметром '''ROWSPAN'''. Принцип действия тут точной такой же:
+
< table >
< table >
Строка 82:
Строка 80:
< /table >
< /table >
-
+
<br>
[[Image:Tbl3.jpg|400px|Таблица]]
[[Image:Tbl3.jpg|400px|Таблица]]
+
<br>
-
===Расстояние между ячейками===
+
=== Расстояние между ячейками ===
-
+
-
Убрать пространство между ячейками таблицы можно при помощи атрибута cellspacing с параметром «0», которая должна прописываться возле тэга TABLE.
+
Убрать пространство между ячейками [[Дидактический материал на тему: Электронные таблицы|таблицы]] можно при помощи атрибута cellspacing с параметром «0», которая должна прописываться возле тэга TABLE.
Попробуем проделать такую операцию с нашей таблицей:
Попробуем проделать такую операцию с нашей таблицей:
А для того, чтобы наоборот расширить границы прописываем атрибуту cellspacing значение, к примеру, «6».
А для того, чтобы наоборот расширить границы прописываем атрибуту cellspacing значение, к примеру, «6».
+
<br> [[Image:Tbl5.jpg|400px|Таблица]]
-
[[Image:Tbl5.jpg|400px|Таблица]]
+
<br>
-
+
-
===Увеличение размеров таблицы===
+
=== Увеличение размеров таблицы ===
Все это время действия проводились над таблицей небольшого размера. Давайте попробуем увеличить ее.
Все это время действия проводились над таблицей небольшого размера. Давайте попробуем увеличить ее.
-
Для этого возле того же таки тэга TABLE прописываем атрибут cellpadding с любым значением (возмем 30):
+
Для этого возле того же таки [[Основні теги. Каркас веб-сторінки. Повні уроки|тэга]] TABLE прописываем атрибут cellpadding с любым значением (возмем 30):
''1. Как растянуть отдельную ячейку по ширине строки? ''
+
''1. Как растянуть отдельную ячейку по ширине строки? ''
-
''2. Как расширить столбец на две строки? ''
+
''2. Как расширить столбец на две строки? ''
-
''3. Каким командами убирается/добавляется расстояние между ячейками? ''
+
''3. Каким командами убирается/добавляется расстояние между ячейками? ''
-
''4. С помощью каких атрибутов можно увеличить размер всей таблицы? '
+
''4. С помощью каких атрибутов можно увеличить размер всей таблицы? '''
<br>
<br>
-
==Список использованных источников==
+
== Список использованных источников ==
-
''1. Урок на тему: «Вставка и форматирование таблиц в HTML», Голубенко Н. С., г. Киев. ''
+
''1. Урок на тему: «Вставка и форматирование таблиц в [[Вступление в HTML. Полные уроки|HTML]]», Голубенко Н. С., г. Киев. ''
''2. Гончаров А. Самоучитель HTML. - СПб.: Питер, 2002 г.''
''2. Гончаров А. Самоучитель HTML. - СПб.: Питер, 2002 г.''
-
''3. Мержевич В. В. HTML и CSS на примерах. - СПб.: БХВ-Петербург, 2005 г. ''
+
''3. Мержевич В. В. HTML и CSS на примерах. - СПб.: БХВ-Петербург, 2005 г. ''
-
''4. Хольцшлаг М. Языки HTML и CSS: для создания Web-сайтов. — М.: ТРИУМФ, 2007 г. ''
+
''4. Хольцшлаг М. Языки HTML и CSS: для создания Web-сайтов. — М.: ТРИУМФ, 2007 г. ''
+
<br>
----
----
+
<br> ''Отредактировано и выслано преподавателем Киевского национального [http://xvatit.com/vuzi/ukraine-ukr/ университета] им. Тараса Шевченко Соловьевым М. С.''
-
''Отредактировано и выслано преподавателем Киевского национального университета им. Тараса Шевченко Соловьевым М. С.''
+
<br>
-
+
----
----
+
<br> '''Над уроком работали'''
-
'''Над уроком работали'''
+
Голубенко Н. С.
-
Голубенко Н. С.
+
Соловьев М. С.
-
+
-
Соловьев М. С.
+
+
<br>
----
----
-
+
<br> Поставить вопрос о современном образовании, выразить идею или решить назревшую проблему Вы можете на [http://xvatit.com/forum/ '''Образовательном форуме'''], где на международном уровне собирается образовательный совет свежей мысли и действия. Создав [http://xvatit.com/club/blogs/ '''блог,'''] Вы не только повысите свой статус, как компетентного преподавателя, но и сделаете весомый вклад в развитие школы будущего. [http://xvatit.com/school/guild/ '''Гильдия Лидеров Образования'''] открывает двери для специалистов высшего ранга и приглашает к сотрудничеству в направлении создания лучших в мире школ.<br>
-
Поставить вопрос о современном образовании, выразить идею или решить назревшую проблему Вы можете на [http://xvatit.com/forum/ '''Образовательном форуме'''], где на международном уровне собирается образовательный совет свежей мысли и действия. Создав [http://xvatit.com/club/blogs/ '''блог,'''] Вы не только повысите свой статус, как компетентного преподавателя, но и сделаете весомый вклад в развитие школы будущего. [http://xvatit.com/school/guild/ '''Гильдия Лидеров Образования'''] открывает двери для специалистов высшего ранга и приглашает к сотрудничеству в направлении создания лучших в мире школ.<br>
А для того, чтобы наоборот расширить границы прописываем атрибуту cellspacing значение, к примеру, «6».
Увеличение размеров таблицы
Все это время действия проводились над таблицей небольшого размера. Давайте попробуем увеличить ее.
Для этого возле того же таки тэга TABLE прописываем атрибут cellpadding с любым значением (возмем 30):
< table cellspacing="6" cellpadding="30" >
Вопросы
1. Как растянуть отдельную ячейку по ширине строки?
2. Как расширить столбец на две строки?
3. Каким командами убирается/добавляется расстояние между ячейками?
4. С помощью каких атрибутов можно увеличить размер всей таблицы? '
Список использованных источников
1. Урок на тему: «Вставка и форматирование таблиц в HTML», Голубенко Н. С., г. Киев.
2. Гончаров А. Самоучитель HTML. - СПб.: Питер, 2002 г.
3. Мержевич В. В. HTML и CSS на примерах. - СПб.: БХВ-Петербург, 2005 г.
4. Хольцшлаг М. Языки HTML и CSS: для создания Web-сайтов. — М.: ТРИУМФ, 2007 г.
Отредактировано и выслано преподавателем Киевского национального университета им. Тараса Шевченко Соловьевым М. С.
Над уроком работали
Голубенко Н. С.
Соловьев М. С.
Поставить вопрос о современном образовании, выразить идею или решить назревшую проблему Вы можете на Образовательном форуме, где на международном уровне собирается образовательный совет свежей мысли и действия. Создав блог, Вы не только повысите свой статус, как компетентного преподавателя, но и сделаете весомый вклад в развитие школы будущего. Гильдия Лидеров Образования открывает двери для специалистов высшего ранга и приглашает к сотрудничеству в направлении создания лучших в мире школ.
