Методическая разработка "Программирование списков в HTML"
методическая разработка по информатике и икт (10 класс) на тему
Методическая разработка "Программирование списков в HTML" 10 класс
Скачать:
Вложение | Размер |
---|---|
![]() | 21.66 КБ |
Предварительный просмотр:
Программирование списков
Продолжим рассмотрение команд, которые помогают делать текст на экране красивым.
HTML допускает задание в документах списков двух типов:
Маркированный список | Нумерованный список |
Список вопросов Пятачка:
| Список слов из словаря Эллочки:
|
Маркированный список
Каждый элемент этого списка браузер предваряет меткой в начале строки, а сами строки смещает вправо.
Команда UL, задающая маркированный список, имеет следующую структуру:
Описание команды | Пример |
<UL> <LI>первый элементLI> <LI>второй элементLI> ... <LI>последний элементLI> UL> | <UL> <LI>Какой он, этот Слонопотам?LI> <LI>Неужели очень злой?LI> ... <LI>И как он их любит?LI> UL> |
Замечание
Конечный тег LI> не является обязательным.
Вид метки, которую браузер помещает перед каждым элементом списка, настраивается при помощи атрибута type. Этот атрибут может отсутствовать или принимать одно из трех значений:
Начальный тег | Вид метки на экране |
<UL> |
|
<UL type=circle> |
|
<UL type=disc> |
|
<UL type=square> |
|
Пример маркированного списка
Программа
Нумерованный список
В нумерованных списках каждый элемент снабжен номером, вид и начальное значение которого настраивается специальным атрибутом.
Нумерованный список задается при помощи команды .
Описание команды | Пример |
<OL> <LI>первый элементLI> <LI>второй элементLI> ... <LI>последний элементLI> OL> | <OL> <LI>Хамите.LI> <LI>Хо-хо!LI> ... <LI>Жуть.LI> OL> |
Замечание
Конечный тег LI> не является обязательным.
Вид номера определяется значением атрибута type.
Начальный тег | Вид номера на экране |
<OL> |
|
<OL type=1> |
|
<OL type=A> |
|
<OL type=a> |
|
<OL type=I> |
|
<OL type=i> |
|
Естественную нумерацию элементов списка (с единицы) можно изменить при помощи атрибута start=n. Число n задает начальное значение нумерации. Если для нумерации используются буквы или римские цифры, то стартовое значение равно n-му элементу в системе нумерации (например, 4 означает D или IV).
Пример нумерованного списка
Программа
Замечание
Мои браузеры Microsoft Internet Explorer и Netscape Navigator делают фиксированный отступ для вывода элементов списка на экран. Нумерация при этом, смещается от отступа к левому краю окна. Когда номер достаточно большой, места не хватает, и номер “налезает” на соответствующий элемент списка. Для исключения этого неприятного эффекта в программе примера использована команда <BLOCKQUOTE>. Эта команда “насильственным” путем увеличивает левый отступ списка.
Вложенные списки
Элемент любого списка сам может быть списком. Уровень вложенности в принципе не ограничен, и это позволяет с успехом использовать списки для отображения сложныхиерархических структур.
Самостоятельная работа
Вариант 1
Как сделать хороший HTML-документ
- Структурировать материал
- Разбить материал на главы, параграфы, пункты
- Придумать заголовки частей
- Продумать стиль оформления
- Выбрать цвета
- Выбрать цвет фона
- Выбрать цвет основного текста
- Выбрать цвета для выделения отдельных элементов документа
- Зафиксировать способы оформления отдельных элементов
- Написать программу
- Провести тестирование и отладку программы
Вариант 2
Рекомендации по использованию списков
- Маркированный список удобен тогда, когда порядок элементов в нем не важен. Примеры:
- список продуктов для приготовления борща;
- список команд исполнителя;
- список школьных предметов.
- Нумерованный список особенно хорош для описания действий, в которых важен порядок следования. Примеры:
- рецепт приготовления борща;
- программа для исполнителя;
- расписание уроков.
По теме: методические разработки, презентации и конспекты
Создание списков различных видов в HTML документе
Добрый день.Тема урока: создание списков в HTML.Презентация расчитана на работу учителя возле интерактивной доски, но можно и без.К презентации идут два видео ролика, которые должны находится вместе с...
![](/sites/default/files/pictures/2013/11/24/picture-353024-1385286644.jpg)
Методическая разработка по информатике 8 класс Тема «Работа с таблицами и списками»
Предлагаю вашему вниманию методическую разработку по информатике, которая может быть использована учителем на уроках информатики для изучения темы «Работа с таблицами и списками» в 8 классах общеобраз...
![](/sites/default/files/pictures/2017/12/25/picture-299080-1514182817.jpg)
Методическая разработка Microsoft Excel (выпадающие списки, функция "ЕСЛИ")
Методическая разработка Microsoft Excel (выпадающие списки, функция "ЕСЛИ")...
![](/sites/default/files/pictures/2018/11/13/picture-53190-1542115370.jpg)
Методическая разработка "Основы языка разметки гипертекста HTML" 10 класс
В архиве есть файл с конспектом урока и практическая часть "Интерактивные формы". УМК Угринович Н.Д....
![](/sites/default/files/pictures/2016/01/28/picture-744764-1453957724.jpg)
Конспект урока "Создание списков в HTML. Духовность в сибирском пейзаже".
Цели урока:& познакомить обучающихся с технологией создания списков;& продемонстрировать приемы создания списков;& научить создавать номерованные и маркированные списки н...
![](/sites/default/files/pictures/2020/12/19/picture-1297883-1608331127.jpg)
3 Внеурочные занятия 8 класс. Форматирование текста, списки на HTML-странице
Форматирование текста — средства его изменения, такие как выбор начертания шрифта и использование эффектов, позволяющих менять вид текста. Списком называется взаимосвязанный набор отдельных...
![](/sites/default/files/pictures/2023/12/11/picture-1379493-1702292708.jpg)
Методическая разработка практического урока «Язык создания гипертекстовых документов – HTML. Теги форматирования текста. Вставка рисунков, создание гиперссылки. Списки. Таблицы» 11 класс
HyperText Markup Language (HTML) является стандартным языком, предназначенным для создания гипертекстовых документов в среде WEB. HTML-документ представляет собой обычный текстовый файл, который вы мо...