Тема: списки на web-страницах

      Комментарии к записи Тема: списки на web-страницах отключены

Язык HTML поддерживает три вида списков: упорядоченные (нумерованные), неупорядоченные (ненумерованные) и списки определений.

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

Нумерованные списки задаются с помощью парного тега

    . Список содержит, естественно, элементы списка, которые определяются парным тегом

  1. . Закрывающий тег
  2. можно опускать.

Ненумерованные списки задаются парным тегом

    . Элементы списка задаются также тегом

  • . С помощью атрибута TYPE тега
    можно задать вид маркера списка:

“disc” – круг,

“square” – квадрат,

“circle”- окружность.

Замечание: по умолчанию маркеры имеют атрибут “circle”.

3. С помощью языка HTML можно создавать списки определений, т.е. определения понятий оформляются также как в словаре. Списки определений задаются парным тегом . Внутри него текст оформляется в виде т е р м и н а , который выделятся непарным тегоми о п р е д е л е н и я, которое следует за непарным тегом .

Тема: Фреймы

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

Документ, использующий фреймы, содержит только описание внешнего вида фреймов, которое выполняется в таге …, используемом вместо тага . У тагаесть две главных опции — rows=список величин и cols=список величин, описывающие, соответственно, строки и столбцы таблицы фреймов.

Строка список величин представляет собой разделенный запятыми перечень значений в пикселах, процентах или относительных величинах. Например, тагсоздает сетку из 3 кадров, высота которых равна 100, 240 и 140 пикселов соответственно,создает 2 кадра с шириной 25 и 75 процентов от ширины окна браузера, а- 2 кадра с шириной 1/3 и 2/3 ширины окна браузера.

Эти способы можно использовать и совместно — например,указывает оставить 128 пикселов слева под первый фрейм, а все остальное пространство — под второй. При определении обоих атрибутов rows и cols, например,получается сетка кадров.

Другие опции тага :

border=ширина — указывает ширину обрамления всех рамок для всех кадров, в пискелах;

frameborder=yes или frameborder=no — включает или выключает отображение обрамления кадров. В случае yes рамка имеет трехмерную форму, иначе она невидима, то есть имеет цвет фона окна по умолчанию. Некоторые браузеры понимают эту опцию только в виде frameborder=1 или frameborder=0, поэтому обычно указывают оба способа;

framespacing=ширина — указать ширину промежутка между смежными кадрами в пискелах. Не действует в Netscape Navigator.

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

Перечислим основные опции тага :

1. опция src=url указывает URL исходного документа для данного кадра;

2. опция name=строка указывает имя кадра. Это необходимо сделать, если предполагается ссылаться из одних кадров на другие;

3. опция scrolling=значение управляет линейками прокрутки кадра. Значение может быть задано в виде yes (линейки есть всегда), no (никогда) или auto (если необходимо);

4. опция noresize запрещает изменять размеры кадра. Опция noresize, указанная для данного кадра, влияет также и на все кадры, смежные с ним;

5. опция frameborder может указываться также внутри тага , со всеми замечаниями, которые сделаны относительно нее. Указание этой опции в тагеотменяет указание, сделанное в тагедля данного кадра и всех, смежных с ним;

6. опции magrinheight=ширина и marginwidth=ширина задают размещение по верхней-нижней и боковым сторонам кадра областей свободного пространства, ширина которых указывается в пикселах.

После того, как тагзакрыт, можно использовать таг …, определяющий содержимое, которое будет выводиться браузерами, не поддерживающими кадры.

Для создания более сложных конфигураций кадров тагимогут вкладываться друг в друга — внутренний тагможет быть вложен вместо любого из тагов .

Пример документа с фреймами:

Извините, Ваш браузер не поддерживает кадры!

Здесь верхний кадр высотой 40 пикселов может служить, например, для вывода рекламы и связан с файлом reclama.html. Остальная часть окна разбита на 2 колонки. Левая колонка имеет ширину 128 пикселов и может быть предназначена для вывода меню (документ menu.html). Третий кадр занимает основную часть окна и предназначен для вывода информации (файл index.html).

Для создания ссылки из одного кадра в другой достаточно указать в таге ссылки опцию вида target=имя кадра. Например, для ссылки из кадра menu в кадр main достаточно написать в документе menu.html ссылку вида … При щелчке по этой ссылке содержимое правого кадра, то есть, документ index.html, будет заменено на новый документ.

При работе с кадрами можно также указывать опцию target в одном из видов _self (загрузить в тот же кадр, откуда делается ссылка), _parent (загрузить в родительский для данного кадр; если такого нет — результат действия аналогичен _self) или _top (загрузить в полное окно, разрушая все кадры).

Задание по теме Работа с фреймами

Создайте документ, содержащий 2 вертикально расположенных фрейма. Левый фрейм (узкий) предназначен для вывода меню, правый (широкий) — для вывода содержимого документов, на которые Вы ссылаетесь из меню. Размеры фреймов должны быть изменяемы. Оставьте небольшое свободное пространство между фреймами.

Создайте в левом фрейме меню для навигации по всем страницам Вашего сайта. Проверьте работу документа с фреймами.

Статьи к прочтению:

HTML для начинающих — #3 — Списки


Похожие статьи:

  • Тема: гипертекстовые ссылки

    Гипертекстовая ссылка (рисунок 1) является фрагментом текста и позволяет ссылаться на какой-нибудь другой файл, имеющий расширение .htm. Т.о, можно…

  • Тема 5. вставка объектов в html-документ

    Основное содержание темы: Вставка изображения в документе HTML. Выравнивание изображений, задание размеров изображений. Относительные и абсолютные…