Язык разметки гипертекстов HTML презентация в формате PowerPoint - скачать бесплатно

Скачать презентацию на тему: "Язык разметки гипертекстов HTML" с количеством слайдов в размере 61 страниц. У нас вы найдете презентацию на любую тему и для каждого класса школьной программы. Мы уверены, что наши слайды помогут найти вам свою аудиторию. Весь материал предоставлен бесплатно, в знак благодарности мы просим Вас поделиться ссылками в социальных сетях и по возможности добавьте наш сайт MirPpt.ru в закладки.

Содержание [Показать]

Нажмите для просмотра
Язык разметки гипертекстов HTML

1: Тема : Язык разметки гипертекстов HTML Вопрос 1. Назначение и структура языка HTML

2: HTML – Hiper Text Markup Language -это язык описания структуры страниц HTML – Hiper Text Markup Language -это язык описания структуры страниц «тэг» от англ. tag – метка, ярлык, этикетка, бирка Общая схема построения строки html – документа : ТЕКСТ

3: Правила: Правила: Пробелы в тексте игнорируются. Тэги форматирования могут быть написаны строчными и/или прописными буквами. Тэги следует писать парами.

4: Любой html - документ имеет следующую структуру: Любой html - документ имеет следующую структуру: …. . …. .

5: Листинг 1 Листинг 1 СТИХИ Ночь. Улица. Фонарь. Аптека. Бессмысленный и тусклый свет. ПРИМЕР

6: Вопрос 2. Тэги форматирования текста в html - документах - перенос на другую строку, не имеет теговой пары Пример

7: Тэговая пара , Этот текст следует вывести шрифтом Arial КРУПНЫЙ ТЕКСТ МЕЛКИЙ ТЕКСТ

8: Красный шрифт Красный шрифт Зеленый шрифт Синий шрифт Серый шрифт

9: КРУПНЫЙ ЗЕЛЕНЫЙ ШРИФТ ГАРНИТУРЫ ARIAL

10: Тэг начала абзаца , ТЕКСТ, ВЫРАВНЕННЫЙ ПО ЛЕВОМУ ПОЛЮ ТЕКСТ, ВЫРАВНЕННЫЙ ПО ЦЕНТРУ ТЕКСТ, ВЫРАВНЕННЫЙ ПО ПРАВОМУ ПОЛЮ

11: , - делает текст жирным; , - делает текст жирным; , - делает текст наклонным; , - делает текст подчеркнутым; , - делает текст зачеркнутым.

12: Тэги для заголовков Заголовок 1 Заголовок 2 Заголовок 3 Заголовок 4 Заголовок 5 Заголовок 6

13: Тэги , Тэги , - увеличивают размер символов, заключенных между ними, на единицу. Тэги И - уменьшают размер символов на единицу.

14: Тэги формирования списков , - тэги для формирования нумерованных списков; , - тэги для формирования маркированных списков Каждый элемент списка обрамляется тэговой парой , ПРИМЕР

15: Тэги и , -надстрочный индекс. , - подстрочный индекс. ПРИМЕР

16: ПРИМЕР

17: Формирование списка определений - начало/конец списка - определяемый термин - определение термина пример

18: Вопрос 3. Формирование горизонтальных линий ПРИМЕР

19: Вопрос 4. Создание таблиц - НАЧАЛО И КОНЕЦ ТАБЛИЦЫ - НАЧАЛО И КОНЕЦ СТРОКИ - НАЧАЛО И КОНЕЦ СТОЛБЦА

22: Параметры тега

23: Параметры тэга

25: Вопрос 5. Использование графики в HTML - документах

26: GIF (GRAPHIC INTERCHANGE FORMAT) – 256 цветовых оттенков GIF (GRAPHIC INTERCHANGE FORMAT) – 256 цветовых оттенков Свойства – прозрачность и анимация JPEG (JOINT PHOTOGRAPHIC EXPERT GROUP) – объединенная группа экспертов по изображениям, семейство форматов, основано на математических алгоритмах сильного сжатия изображения

27: - использование графики в качестве фона - файл расположен в сети -файл расположен в текущем каталоге

28: Параметр DGPROPERTIESFIXED- фиксирует фон в момент прокрутки - вставка графического изображения в документ

29: Параметры тэга IMG

31: Вопрос 6. Создание гиперссылок Гиперссылка состоит из двух частей: псевдокнопки и адресной части (URL) Любой текст Параметры тэга TARGET – указывает область загрузки ресурса. TARGET BLANK – загружает документ в новое окно пример

32: Вопрос 7. Создание фреймов Пример фреймов

33: Параметры фреймов

34: Параметры тэга

37: Плавающие фреймы Тэги

38: Вопрос 8. Использование форм при создании html – документов

39: Параметры тэга

42: Кнопки с зависимой фиксацией TYPERADIO - для выбора пользователем одного значения из нескольких возможных Например: NAME – указывает наименование поля (кнопки) VALUE – содержит значение поля

43: Кнопка с независимой фиксацией При создании форм часто требуется получить ответ пользователя на вопрос типа «Да/Нет». Для создания таких кнопок используется значение CHECKBOX параметра TYPE. Например: Молилась ли ты на ночь, Дездемона?

44: Кнопка «Выполнить» Создается при помощи тэга с параметром TYPE SUBMIT Значение параметра VALUE задает текст, который появится на кнопке. Действие определяется параметром ACTION тэга FORM

45: Кнопка «Восстановить значение по умолчанию» Создается при помощи тэга с параметром TYPE RESET

46: Использование списков в форме Тэг поддерживает три необязательных атрибута: MULTIPLE - позволяет выбрать более чем одно наименование; NAME - определяет наименование объекта; SIZE - определяет число видимых пользователю пунктов списка -для определения списка пунктов

47: Пример Первый Второй Третий Четвертый

48: Ввод текстового массива позволяет организовать ввод текста из нескольких строк в специальном окне, снабженном полосой прокрутки Пример: Комментарий Введите любую текстовую информацию Пример

49: Вопрос 9. Назначение CSS Вопрос 9. Назначение CSS Каскадные таблицы стилей Cascading Style Sheets (CSS) разработаны консорциумом World Wide Web Consortium (W3C).

50: Практическое значение CSS для Web – инжиниринга (совокупности технологий разработки и сопровождения Web - узлов) заключается в том, что процесс создания узла можно формализовать и представить в виде последовательности действий: Практическое значение CSS для Web – инжиниринга (совокупности технологий разработки и сопровождения Web - узлов) заключается в том, что процесс создания узла можно формализовать и представить в виде последовательности действий: необходимо определиться с номенклатурой страниц, т. е. все страницы проектируемого Web – узла разбить на типы (домашняя страница, навигационные страницы, информационные страницы, коммуникационные страницы и т. п. );

51: для каждого типа страницы разработать определенную логическую структуру (стандартный набор компонентов страницы); для каждого типа страницы разработать определенную логическую структуру (стандартный набор компонентов страницы); следует создать навигационную карту узла и форму ее реализации на страницах; для каждого стандартного компонента разработать стиль его отображения (CSS - описатель); рисовать картинки, создать анимацию, писать программы, вручную вводить текст и графику или генерировать содержимое страниц автоматически при обращении к ним

52: Способы применения CSS Способы применения CSS Создание и использование файлов таблиц стилей; Встраивание таблиц стилей в документы HTML; Встраивание стилей в тэги HTML.

53: Способ 1. Файл таблицы стилей (. css) Способ 1. Файл таблицы стилей (. css) H1 font-size: 24; font-weigt: bold; color: red; margin-left: 10 H2 font-size: 20; font-weigt: bold; color: black; font-family: Courier P. italic font-style: italic P. red color: red

54: Для того чтобы документ HTML был оформлен с использованием файла таблицы стилей, в разделе заголовка документа необходимо разместить тэг . Для того чтобы документ HTML был оформлен с использованием файла таблицы стилей, в разделе заголовка документа необходимо разместить тэг . Пример ……. Команды ………

55: Как пользоваться стилями из файла таблицы стилей? Как пользоваться стилями из файла таблицы стилей? Если в файле определены параметры для тэгов языка HTML, предназначенных для оформления текста (например, для операторов или , как в нашем примере), необходимо просто указать эти операторы без изменений. Пример: Заголовок первого уровня

56: При определении стиля можно не только переопределить параметры форматирования операторов, но и создать новые классы для этих операторов. При определении стиля можно не только переопределить параметры форматирования операторов, но и создать новые классы для этих операторов. Например, ниже определены классы italic и red для тэга : P. italic font-style: italic P. red color: red

57: Для того чтобы задействовать созданные классы, необходимо указать имя нужного класса в параметре CLASS тэга (или другого оператора форматирования текста). Для того чтобы задействовать созданные классы, необходимо указать имя нужного класса в параметре CLASS тэга (или другого оператора форматирования текста). Пример: Наклонный текст Текст красного цвета

58: Способ 2. Встраивание таблиц стилей в документы HTML Способ 2. Встраивание таблиц стилей в документы HTML Если отдельные документы HTML должны быть оформлены особым образом, отличным от того, который задан в общих таблицах стилей, можно встроить таблицы стилей непосредственно в текст документа HTML. Такие таблицы называются встроенными (embedded) таблицами стилей

59: Пример: Пример: … Встроенная таблица стилей ….

60: Способ 3. Встраивание стилей в операторы HTML Способ 3. Встраивание стилей в операторы HTML Данный способ предполагает встраивание стилей непосредственно в тэги языка HTML и применение стилей для оформления отдельных фрагментов документа HTML.

61: Пример: Пример: …Заголовок первого уровня Заголовок второго уровня Наклонный текст Текст красного цвет . . . . . 1способ2способ 3способ

Скачать презентацию


MirPpt.ru