Презентация "Фреймы и списки"

  • Презентации учебные
  • pptx
  • 11.02.2019
Публикация на сайте для учителей

Публикация педагогических разработок

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

Фреймы в переводе с английского означает рамка. Часто фреймы используются для навигации по сайту. О правилах вставки фреймов с списков в гипертекстовый документы, об особенностях работы с элементами списков рассказано в данной обучающей презентации. Презентация для студентов колледжа обучающихся по профессии "Мастер по обработке цифровой информации"
Иконка файла материала фреймы и списки.pptx
ПРАВИЛА ВСТ АВКИ ФРЕЙМО В
В переводе с английского, фрейм это рамка. И в HTML значение похожее. Фрейм — это совершенно отдельный прямоугольный элемент (область) окна браузера, который содержит и показывает свой HTML-документ. Фрейм это как отдельная ячейка таблицы, содержание с другой страницы. Фреймы универсальны и независимы друг от друга, каждый из фреймов размещенных на странице может иметь свой адрес и свои подгружаемые стили. Самое главное, что если вы нажмете на ссылку во фрейме, подгружаться это все дело будет внутри фрейма, не затрагивая которой подгружается
Правила вставки фреймов Свойства фрейма определяется тегом — он поддерживается во всех браузерах (в т.ч. мобильных). Тег помещается в контейнер . И, если фрейм участвует в определении свойств одного фрейма, то фреймсет дополнительно размечает страницу сайта на области. И уже в эти области, вы можете подгрузить фрейм с параметром src=»». Пример синтаксиса:
В этом теге не требуется закрывающий тег типа , а вот для — требуется. Список атрибутов фреймов: bordercolor — определяет цвет пограничной линии (границы) frameborder — задает рамку вокруг фрейма или ее отсутствие name — используется для задания уникального имени (не обязателен, но рекомендован) — это нужно чтобы иметь возможность задавать ссылку к конкретному фрейму noresize — параметр для определения возможности пользовательского редактирования (мышкой) размера области фрейма scrolling — задает отображение внутрифреймовой прокрутки в том случае если содержимое фрейма не помещается в его физические размеры, может принимать следующие значения: yes, no, auto src — последний и самый главный параметр — в нем указывается путь (адрес) к файлу или странце, которую вы хотите подгрузить внутри фрейма marginwidth — с помощью этого параметра можно задать отступ от содержимого фрейма до его левого края marginheight а с помощью этого параметра мы задаем отступ
определяет Фреймсет тоже имеет параметры: rows — количество горизонтальных областей, на которые будет разбито окно: для задания четырех горизонтальных областей с шириной 25% нужно задать параметр rows=»25%, 25%, 25%, 25%» cols — аналогично горизонтальным областям, только теперь определение вертикальных областей А для того чтобы фреймсет не имел следующие рамок, атрибуты: border=»0″ frameborder=»0″. используйте
HTML Списки HTML поддерживает списки трех разных типов, для каждого из которых предусмотрены свои собственные теrи:
     – нумерованный (с помощью цифр или букв) список, каждый элемент которого имеет порядковый номер (букву);
       – маркированный (не нумерованный) список, рядом с каждым элементом которого помещается маркер (а не цифровые или буквенные символы, обозначающие порядковый номер);
       – список определений состоит из пар «имя/значение», в том числе терминов и
Нумерованные списки В нумерованный список браузер автоматически вставляет номера элементов по порядку, начиная с некоторого значения (обычно 1). Это позволяет вставлять и удалять пункты списка, не нарушая нумерации, так как остальные номера автоматически будут пересчитаны. Нумерованные списки создаются с помощью блочного элемента 
     (от англ. Ordered List – нумерованный список). Далее в контейнер 
       для каждого пункта списка помещается элемент 
    1.  (от англ. List Item – пункт списка). По умолчанию применяется нумерованный список с арабскими числами. Тег 
         имеет следующий синтаксис:
        1. элемент 1
        2. элемент 2
        3. элемент 3
Иногда при просмотре существующих кодов HTML вы будете встречать аргумент type в элементе 
    , который используется для указания типа нумерации (буквы, римские и арабские цифры и т.п.). Синтаксис:
      Здесь: type – символы списка: •A — прописные латинские буквы (A, B, C . . .); •a — строчные латинские буквы (a, b, c . . .); •I — большие римские цифры (I, II, III . . .); •i — маленькие римские цифры (i, ii, iii . . .); •1 — арабские цифры (1, 2, 3 . . .) (применяется по умолчанию). Если вы хотите, чтобы список начинался с номера, отличного от 1, следует указать это при помощи атрибута start тега 
        .
Стили оформления нумерованных списков Пример Значение lower-alpha а, Ь, с upper-alpha А, В, С lower-roman i, ii, iii I, II, III upper-roman Описание Строчные буквы Прописные буквы Римские цифры, набранные строчными буквами Римские цифры, набранные прописными буквами
Маркированные списки Маркированные списки по сути похожи на нумерованные только они не содержат последовательной нумерации пунктов. Маркированные списки создаются с помощью блочного элемента 
     (от англ. Unordered List – ненумерованный список). Каждый элемент списка, как и в нумерованных списках, начинается с тега 
  • . Браузер формирует отступ для каждого пункта списка и автоматически отображает маркеры. Тег 
       имеет следующий синтаксис:
      • Первый пункт
      • Второй пункт
      • Третий пункт
элемента 
  •  допустимо тега 
  •  не обязательно размещать Внутри только текст, допустимо поместить любой элемент потокового контента (ссылки, абзацы, изображения и др.) Вложенные списки Любой список может быть вложен в другой. Внутри создание вложенного списка, или списка второго уровня. Для вложения списка опишите новый список внутри элемента 
  •  уже имеющегося списка. При вложении одного маркированного списка в другой браузер автоматически меняет стиль маркера для списка второго уровня. Любой список может быть вложен в другой. Следующий пример демонстрирует структуру маркированного списка, вложенного во второй пункт нумерованного.
  • Стили оформления маркированного списка Значение disc circle square none Описание маркер в форме кружков с заливкой маркер в форме кружков без заливки маркер в форме квадрата с заливкой пункты списка без маркера
    Графические маркеры. В HTML есть возможность создать список с графическими маркерами. Одно дело, когда маркерами списка являются стандартные кружочки или квадратики, и совсем другое – когда разработчик сам подбирает маркер в соответствии с дизайном страницы. Для того, чтобы сделать элементы списка красивыми, часто используют маленькие картинки. Чтобы заменить обычный маркер на графический, заменим свойство list-style- type на свойство list-style-image и укажем URL– адрес картинки:
    Списки определений (описаний) Списки определений очень удобны для создания, например, вашего личного словаря терминов. У каждого пункта списка определений есть две части: термин и его определение. Вы помещаете весь список в элемент 
     (от англ. Definition List – список определений). Он включает в себя теги 
     (от англ. Definition Term – определяемое слово, термин) и 
     (от англ. Definition Description – описание определяемого термина). Списки определений часто используют в научно- технических и учебных изданиях, оформляя с их помощью глоссарии, словари, справочники и т.д. Общая структура списка описаний имеет следующий вид:
    Первый термин
    Описание первого термина
    Второй термин
    Описание второго термина