Создание списков в HTML

В презентации содержатся теги списков в языке HTML, приведены примеры, задания

Вы уже знаете о суперспособностях современного учителя?

Тратить минимум сил на подготовку и проведение уроков.

Быстро и объективно проверять знания учащихся.

Сделать изучение нового материала максимально понятным.

Избавить себя от подбора заданий и их проверки после уроков.

Наладить дисциплину на своих уроках.

Получить возможность работать творчески.

=> ПОЛУЧИТЬ СУПЕРСПОСОБНОСТИ УЧИТЕЛЯ <=

Просмотр содержимого документа
«Создание списков в HTML»

Тема урока:

«Списки в языке HTML »

Цели урока:

Познакомиться с тегами списков в языке HTML и их атрибутами
Научиться создавать списки различных видов с помощью HTML

Понятие списка в HTML

Список – это последовательность строк, определённым образом оформленная.

Список требований к поставщикам:

Поставщик товара для ООО «Группа Компаний Эльф» должен являться непосредственным производителем, эксклюзивным дистрибьютором производителя или предлагать наиболее выгодные условия, если является одним из дистрибьюторов производителя товаров.
Поставщик должен быть способен предоставить отсрочку платежа не менее 21 банковского дня;
Наши поставщики берут на себя обязательства по постпродажному сопровождению продукции, рассмотрению рекламаций, замене брака, гарантийному и не гарантийному ремонту.

Виды списков в HTML

Многоуровневые

(вложенные )

Одноуровневые

Списки определений

Маркированные

Нумерованные

Теги списков и их атрибуты

1. - тег маркированного списка

- тег одного элемента списка.

Пример

HTML- код:

Апельсин

Яблоко

Груша

Результат:

Апельсин
Яблоко
Груша

Тег

Апельсин

Яблоко

Груша

Результат:

Пример

Апельсин
Яблоко
Груша

Теги списков и их атрибуты

2. - тег нумерованного списка

- тег одного элемента списка.

Пример

HTML- код:

Апельсин

Яблоко

Груша

Результат:

Апельсин
Яблоко
Груша

Тег

Атрибуты

type

определяет вид нумерации

A — заглавные латинские буквы

a — строчные латинские буквы

I — заглавные римские цифры

i — строчные римские цифры

1 — арабские цифры (по умолчанию)

start

определяет, с какой цифры начинать нумерацию

Тег

Пример 1:

Апельсин

Яблоко

Груша

Результат:

Апельсин
Яблоко
Груша

Пример 2:

Апельсин

Яблоко

Результат:

Апельсин
Яблоко

Теги списков и их атрибуты

3. – содержит список определений.

– содержит определяемые термины.

– содержит опрeделения.

Тег

Пример

HTML

Гипертекстовый язык разметки

CSS

Каскадные таблицы c тилей

Результат:

HTML

Гипертекстовый язык разметки

CSS

Каскадные таблицы c тилей

Многоуровневые (вложенные) списки

определяются порядком размещения тегов:

Америка

Европа
- Швеция
- Норвегия
- Финляндия

Результат:

Вопросы:

Каким тегом создается маркированный список?

2. Какие маркеры поддерживаются в html?

Квадрат

Круг

Диск

3. Какой маркер используется по умолчанию?

Диск

4. Какой атрибут определяет тип маркера?

5. С помощью какого тега создается нумерованный список?

Вопросы

6. Какие виды нумерации есть в HTML?

Латинские буквы, римские и арабские цифры

7. С помощью какого атрибута определяется вид нумерации?

8. Что определяет атрибут start?

Первую цифру нумерации.

9. В каких случаях можно одновременно использовать атрибуты type и start?

Когда type=1

10 . Какие теги определяют список определений?

, ,

Домашнее задание

К следующему занятию:

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

Предмет: Информатика

Категория: Презентации

Целевая аудитория: Прочее.
Урок соответствует ФГОС

Скачать
Создание списков в HTML

Автор: Клепикова Наталья Николаевна

Дата: 02.02.2023

Номер свидетельства: 624661

Похожие файлы

Конспект урока по теме "Язык HTML. Создание списка"

object(ArrayObject)#852 (1) {
  ["storage":"ArrayObject":private] => array(6) {
    ["title"] => string(88) "Конспект урока по теме "Язык HTML. Создание списка""
    ["seo_title"] => string(46) "konspiekturokapotiemieiazykhtmlsozdaniiespiska"
    ["file_id"] => string(6) "299643"
    ["category_seo"] => string(11) "informatika"
    ["subcategory_seo"] => string(5) "uroki"
    ["date"] => string(10) "1456570724"
  }
}

Презентация к уроку язык гипертекстовой разметки HTML

object(ArrayObject)#874 (1) {
  ["storage":"ArrayObject":private] => array(6) {
    ["title"] => string(97) "Презентация к уроку язык гипертекстовой разметки HTML "
    ["seo_title"] => string(62) "priezientatsiia-k-uroku-iazyk-ghipiertiekstovoi-razmietki-html"
    ["file_id"] => string(6) "101311"
    ["category_seo"] => string(11) "informatika"
    ["subcategory_seo"] => string(11) "presentacii"
    ["date"] => string(10) "1402413420"
  }
}

Создание теста по геометрии в 10 классе «Аксиомы стереометрии» в сервисе Simpoll

object(ArrayObject)#852 (1) {
  ["storage":"ArrayObject":private] => array(6) {
    ["title"] => string(142) "Создание теста по геометрии в 10 классе «Аксиомы стереометрии»  в сервисе Simpoll "
    ["seo_title"] => string(89) "sozdaniie-tiesta-po-ghieomietrii-v-10-klassie-aksiomy-stierieomietrii-v-siervisie-simpoll"
    ["file_id"] => string(6) "140698"
    ["category_seo"] => string(10) "matematika"
    ["subcategory_seo"] => string(7) "prochee"
    ["date"] => string(10) "1417984389"
  }
}

Конспект урока на тему: Создание веб-страницы: Мир животных

object(ArrayObject)#874 (1) {
  ["storage":"ArrayObject":private] => array(6) {
    ["title"] => string(109) "Конспект урока на тему: Создание веб-страницы: Мир животных "
    ["seo_title"] => string(64) "konspiekt-uroka-na-tiemu-sozdaniie-vieb-stranitsy-mir-zhivotnykh"
    ["file_id"] => string(6) "108791"
    ["category_seo"] => string(11) "informatika"
    ["subcategory_seo"] => string(5) "uroki"
    ["date"] => string(10) "1403861222"
  }
}

Основы языка разметки гипертекста HTML. Списки.

object(ArrayObject)#852 (1) {
  ["storage":"ArrayObject":private] => array(6) {
    ["title"] => string(83) "Основы языка разметки гипертекста HTML. Списки."
    ["seo_title"] => string(46) "osnovy_iazyka_razmetki_giperteksta_html_spiski"
    ["file_id"] => string(6) "529959"
    ["category_seo"] => string(11) "informatika"
    ["subcategory_seo"] => string(5) "uroki"
    ["date"] => string(10) "1575364182"
  }
}

Создание списков в HTML

Просмотр содержимого документа «Создание списков в HTML»

Похожие файлы

Полезное для учителя

Просмотр содержимого документа
«Создание списков в HTML»