Презентація "Таблиці та списки на веб-сторінках"

Про матеріал
Можливе використання як додатку до уроку за новою програмою для 10 класу, модуль "Веб-технології"
Перегляд файлу
Матеріал презентації створено на основі книги: Самоучитель HTML 4.0 А. Г. Жадаев, Киев, «ЮНИОР», 2001.
Таблиці та списки на веб-сторінках. Презентація створена як додаток до уроку. Автор О. В. Гізун
Таблиці <html><head><title>Вправа 5</title></head><body><h2>Результати шкільних олімпіад</h2><table border=2><tr><th>Учасник</th><th>Предмет</th><th> Бали</th></tr><tr><td>9-А клас</td><td >Математика</td> <td> 114</td></tr><tr><td>9-А клас</td><td>Фізика </td><td>81 </td></tr><tr><td>9-А клас</td><td colspan=2>Загальна кількість балів: 195</td></tr></table></body></html>
<table> - тег контейнерний парний містить таблицю{2 D5 ABB26-0587-4 C30-8999-92 F81 FD0307 C}Атрибут Значення summary. Коротка інформація про призначення і структуру таблиці для браузерів, що виконують невізуальне подання документа. Align. Вирівнювання таблиці відносно документа. Значення: left, center, rightwidth. Визначає ширину таблиці, якщо її не вказано то вибір іде автоматично, ширину можна вказувати у відсотках ширини вікна браузера.
{2 D5 ABB26-0587-4 C30-8999-92 F81 FD0307 C}атрибут. Значення aligntop – заголовок зверху (за умовчанням)bottom – заголовок знизуleft – заголовок зліваright – заголовок справа. Тег <caption> розташовується відразу після <table> містить назву таблиці
Елементи TR, TH, TDTR – не має характерних атрибутів і є контейнером для клітинок таблиці, що містять один рядок (тег парний) {table row}Клітинки задаються елементами TH (заголовки), TD (дані).{5 C22544 A-7 EE6-4342-B048-85 BDC9 FD1 C3 A}Атрибут Значення headers. Список заголовків клітинок. Значення атрибута розділений проміжками список заголовків клітинокscope. Визначає набір клітинок даних, яких задається заголовокrow – в клітинці заголовок для останніх клітинок рядкаcol - в клітинці заголовок для останніх клітинок стовпцяrowgroup - в клітинці заголовок для останніх рядків групи в якій є дана клітинкаcolgroup – заголовок для останніх стовпців групи в якій є дана клітинкаrowspan. Визначає кількість рядків, які займає клітинка. За умовчанням – 1. 0 – означає , що клітинка займає всі рядки таблиці від даного до кінця.colspan. Визначає кількість стовпців, які займає клітинка. За умовчанням – 1. 0 – означає , що клітинка займає всі стовпці таблиці від даного до кінця.
Групування клітинок. Елементи thead, tfoot, tbody
<html><head><title>таблиця з заголовками і тілом</title></head><body> <table border= приклад використання верхніх та нижніх заголовків та тіла таблиці верхній заголовок 1 верхній заголовок 2 верхній заголовок 3 нижній заголовок 1 нижній заголовок 2 нижній заголовок 3 the 1st row of the box 1 the 2nd row of the box 1 the 1st row of the box 2 the 2nd row of the box 2 the 3rd row of the box 2 " title="таблиця з заголовками і тілом
приклад використання верхніх та нижніх заголовків та тіла таблиці
верхній заголовок 1 верхній заголовок 2 верхній заголовок 3
нижній заголовок 1 нижній заголовок 2 нижній заголовок 3
the 1st row of the box 1
the 2nd row of the box 1
the 1st row of the box 2
the 2nd row of the box 2
the 3rd row of the box 2
">
<html><head><title>Таблиця з групою стовпців</title></head><body><table border=2><caption><em>Приклад групування за допомогою елемента <h4>colgroup</h4></em></caption><colgroup span=101203041245534" title="Таблиця з групою стовпців
Приклад групування за допомогою елемента

colgroup

101203041245534
">
Списки <HTML><HEAD> <TITLE>НЕВПОРЯДКОВАНИЙ СПИСОК</TITLE></HEAD><BODY> <H3>Шкільні предмети</H3> <UL TYPE=disc> <lh>Природничо-математичний цикл <LI>Математика <LI>Фізика <li>Хімія <li>Біологія <li>Географія	</UL> <UL TYPE=square> <LH>Гуманітарний цикл <LI>Право <LI>Історія <li>Мова <LI>Література </UL></BODY></HTML>
Елементи OL і UL. Теги контейнерні парні. OL– впорядкований список. UL – невпорядкований список. Для форматування заголовка списку використовується тег <LH> контейнерний непарний; кожен пункт починається тегом <LI>{5 C22544 A-7 EE6-4342-B048-85 BDC9 FD1 C3 A}Атрибут Значення compact. Вказівка браузеру показати список у більш компактному вигляді (залежить від налагодження браузера)type. Установка стилю списку1 – маркер у вигляді арабських цифрІ – маркер у вигляді великих римських цифрі – маркер у вигляді малих римських цифр. А – маркер у вигляді прописних буква – маркер у вигляді рядкових буквstart. Установка початкового маркера у поточному списку<OL> - Тег контейнерний парний.
<UL> - тег контейнерний парний. Атрибути крім type відповідають тегу <OL>. {5 C22544 A-7 EE6-4342-B048-85 BDC9 FD1 C3 A}Атрибут Значення typedisc – маркер круг;circle – маркер коло; square – маркер квадрат. Списки можна комбінувати!Хочу бути впевненим, що запропонована інформація стане Вам в нагоді!Запрошую Вас до спів праці!
Зміст слайдів
Номер слайду 1

Матеріал презентації створено на основі книги: Самоучитель HTML 4.0 А. Г. Жадаев, Киев, «ЮНИОР», 2001.

Номер слайду 2

Таблиці та списки на веб-сторінках. Презентація створена як додаток до уроку. Автор О. В. Гізун

Номер слайду 3

Таблиці Вправа 5

Результати шкільних олімпіад

УчасникПредмет Бали
9-А класМатематика 114
9-А класФізика 81
9-А класЗагальна кількість балів: 195

Номер слайду 4

- тег контейнерний парний містить таблицю{2 D5 ABB26-0587-4 C30-8999-92 F81 FD0307 C}Атрибут Значення summary. Коротка інформація про призначення і структуру таблиці для браузерів, що виконують невізуальне подання документа. Align. Вирівнювання таблиці відносно документа. Значення: left, center, rightwidth. Визначає ширину таблиці, якщо її не вказано то вибір іде автоматично, ширину можна вказувати у відсотках ширини вікна браузера.

Номер слайду 5

{2 D5 ABB26-0587-4 C30-8999-92 F81 FD0307 C}атрибут. Значення aligntop – заголовок зверху (за умовчанням)bottom – заголовок знизуleft – заголовок зліваright – заголовок справа. Тег

розташовується відразу після містить назву таблиці

Номер слайду 6

Елементи TR, TH, TDTR – не має характерних атрибутів і є контейнером для клітинок таблиці, що містять один рядок (тег парний) {table row}Клітинки задаються елементами TH (заголовки), TD (дані).{5 C22544 A-7 EE6-4342-B048-85 BDC9 FD1 C3 A}Атрибут Значення headers. Список заголовків клітинок. Значення атрибута розділений проміжками список заголовків клітинокscope. Визначає набір клітинок даних, яких задається заголовокrow – в клітинці заголовок для останніх клітинок рядкаcol - в клітинці заголовок для останніх клітинок стовпцяrowgroup - в клітинці заголовок для останніх рядків групи в якій є дана клітинкаcolgroup – заголовок для останніх стовпців групи в якій є дана клітинкаrowspan. Визначає кількість рядків, які займає клітинка. За умовчанням – 1. 0 – означає , що клітинка займає всі рядки таблиці від даного до кінця.colspan. Визначає кількість стовпців, які займає клітинка. За умовчанням – 1. 0 – означає , що клітинка займає всі стовпці таблиці від даного до кінця.

Номер слайду 7

Групування клітинок. Елементи thead, tfoot, tbody

Номер слайду 8

таблиця з заголовками і тілом

приклад використання верхніх та нижніх заголовків та тіла таблиці
верхній заголовок 1 верхній заголовок 2 верхній заголовок 3
нижній заголовок 1 нижній заголовок 2 нижній заголовок 3
the 1st row of the box 1
the 2nd row of the box 1
the 1st row of the box 2
the 2nd row of the box 2
the 3rd row of the box 2

Номер слайду 9

Таблиця з групою стовпців

Приклад групування за допомогою елемента

colgroup

101203041245534

Номер слайду 10

Списки НЕВПОРЯДКОВАНИЙ СПИСОК

Шкільні предмети

    Природничо-математичний цикл
  • Математика
  • Фізика
  • Хімія
  • Біологія
  • Географія
    Гуманітарний цикл
  • Право
  • Історія
  • Мова
  • Література

Номер слайду 11

Елементи OL і UL. Теги контейнерні парні. OL– впорядкований список. UL – невпорядкований список. Для форматування заголовка списку використовується тег контейнерний непарний; кожен пункт починається тегом

  • {5 C22544 A-7 EE6-4342-B048-85 BDC9 FD1 C3 A}Атрибут Значення compact. Вказівка браузеру показати список у більш компактному вигляді (залежить від налагодження браузера)type. Установка стилю списку1 – маркер у вигляді арабських цифрІ – маркер у вигляді великих римських цифрі – маркер у вигляді малих римських цифр. А – маркер у вигляді прописних буква – маркер у вигляді рядкових буквstart. Установка початкового маркера у поточному списку
      - Тег контейнерний парний.

  • Номер слайду 12

      - тег контейнерний парний. Атрибути крім type відповідають тегу
        . {5 C22544 A-7 EE6-4342-B048-85 BDC9 FD1 C3 A}Атрибут Значення typedisc – маркер круг;circle – маркер коло; square – маркер квадрат. Списки можна комбінувати!Хочу бути впевненим, що запропонована інформація стане Вам в нагоді!Запрошую Вас до спів праці!

    pptx
    Додав(-ла)
    Гізун Олег
    До підручника
    Інформатика (рівень стандарту) 10 клас (Морзе Н.В., Вембер В.П., Кузьмінська О.Г.)
    Додано
    28 березня 2019
    Переглядів
    3333
    Оцінка розробки
    Відгуки відсутні
    Безкоштовний сертифікат
    про публікацію авторської розробки
    Щоб отримати, додайте розробку

    Додати розробку