Разделы презентаций


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

Содержание

Основные понятияТег (языки разметки) — элемент языка разметки гипертекста (например, XML, HTML).HTML (от англ. HyperText Markup Language — «язык гипертекстовой разметки») — стандартный язык разметкиЯзык HTML был разработан британским учёным Тимом Бернерсом-Ли приблизительно в 1986—1991 годах в стенах Европейского Центра ядерных исследований в Женеве (Швейцария). HTML создавался как

Слайды и текст этой презентации

Слайд 1Язык гипертекстовой разметки HTML
Подготовил учитель информатике Пажитнев Максим Викторович

Язык гипертекстовой разметки HTMLПодготовил учитель информатике Пажитнев Максим Викторович

Слайд 2Основные понятия
Тег (языки разметки) — элемент языка разметки гипертекста (например,

XML, HTML).
HTML (от англ. HyperText Markup Language — «язык гипертекстовой разметки») — стандартный язык разметки
Язык HTML был разработан британским учёным Тимом

Бернерсом-Ли приблизительно в 1986—1991 годах в стенах Европейского Центра ядерных исследований в Женеве (Швейцария). HTML создавался как язык для обмена научной и технической документацией, пригодный для использования людьми, не являющимися специалистами в области вёрстки  документов во Всемирной паутине. 
Основные понятияТег (языки разметки) — элемент языка разметки гипертекста (например, XML, HTML).HTML (от англ. HyperText Markup Language — «язык гипертекстовой разметки») — стандартный язык разметкиЯзык

Слайд 3Основные разделы документа HTML.
- начало страницы
-оформление заголовка страницы


заголовок, автор



- текст и основная часть страницы


Основные разделы документа HTML. - начало страницы -оформление заголовка страницы     заголовок, автор

Слайд 4Работа с текстом

ваш заголовок
ваш текст - создание абзаца
ALIGN=“left” –

выравнивание текста по левой стороне
ALIGN=“right” – выравнивание текста по правой стороне
ALIGN=“center” – выравнивание текста по центру
ALIGN=“justify” - выравнивание текста по ширине
- не позволяет разрывать текст на строке

- прерывание текста, перенос на следующую строку
.. - жирный
.. - курсив
.. - подчеркивание
.. - перечеркивание

Работа с текстом

Слайд 5Изменение шрифта и цвета шрифта
цвет шрифта


FACE="Times New Roman“ изменение шрифта
SIZE=“1” – размер шрифта от

1 до 7

Мороз и солнце; день
чудесный!

Еще ты дремлешь, друг прелестный –

Пора, красавица, проснись;

Открой сомкнуты негой взоры

Изменение шрифта и цвета шрифта цвет шрифта FACE=

Слайд 6Изменение цвета шрифта …
aqua

##00FFFF
black ##000000
blue ##0000FF
fuchsia

##FF00FF
gray ##808080
green ##008000
lime ##00FF00
maroon ##800000
navy ##000080
olive ##808000
purple ##800080
red ##FF0000
silver ##C0C0C0
teal ##008080
white ##FFFFFF
yellow ##FFFF00

Изменение цвета шрифта   … aqua    ##00FFFFblack    ##000000blue

Слайд 7Изменение цвета страницы

………………………………………..

Изменение цвета страницы ………………………………………..

Слайд 8Тег и атрибут вставки изображений на Web-странице
 , где xxx.jpg

название файла изображения.
Если картинка находится в папке picture html

код будет такой:

Тег и атрибут вставки изображений на Web-странице , где xxx.jpg название файла изображения. Если картинка находится в папке

Слайд 9Теги и атрибуты гиперссылки на Web-странице
Указатель тег с атрибутом

для создания гиперссылки
… контейнер для создания гиперссылки на адрес электронной

почты
Теги и атрибуты гиперссылки на Web-страницеУказатель тег с атрибутом для создания гиперссылки… контейнер для создания гиперссылки на

Слайд 10Теги и атрибуты для создания списков на Web-странице
… контейнер для

создания нумерованных списков
тег элемента списка
… контейнер для создания

маркированного списка
  • тег элемента списка
    контейнер для создания списка терминов
    тег для создания термина
    тег для создания определения
  • Теги и атрибуты для создания списков на Web-странице… контейнер для создания нумерованных списков тег элемента списка… контейнер

    Слайд 11Алгоритм вставки таблиц:
    1. описание таблицы; 2. описание строки; 3. описание ячейки; 4. ввод

    текста ячейки.

    Алгоритм вставки таблиц:1. описание таблицы; 2. описание строки; 3. описание ячейки; 4. ввод текста ячейки.

    Слайд 12Создание и форматирование таблиц
    Вставка таблицы - парный тэг


    По умолчанию текст выравнивается по левому краю, ширина столбца -

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

    Слайд 13Атрибуты к тэгу
    BORDER “ “ – толщина границы таблицы

    в пикселях
    WIDTH “ “ – ширина таблицы в пикселях

    или процентах, относительно окна браузера



    Атрибуты к тэгу BORDER “ “ – толщина границы таблицы в пикселях WIDTH “ “ – ширина

    Слайд 14Строка таблицы
    Вставка строки таблицы - парный тэг
    Атрибуты:
    Align

    = (left, center, richt) – горизонтальное выравнивание
    Valign = bottom, middle,

    top) – вертикальное выравнивание



    Строка таблицыВставка строки таблицы - парный тэг  Атрибуты:Align = (left, center, richt) – горизонтальное выравниваниеValign =

    Слайд 15Ячейка таблицы
    Вставка ячейки таблицы - парный тэг
    Атрибуты:
    Align

    = (left, center, richt) – горизонтальное выравнивание
    Valign = (bottom, middle,

    top) – вертикальное выравнивание

    Тема доклада

    Ячейка таблицыВставка ячейки таблицы - парный тэг  Атрибуты:Align = (left, center, richt) – горизонтальное выравниваниеValign =

    Слайд 16Ширина и высота таблицы
     WIDTH (ширина таблицы) и HEIGHT (высота таблицы)

    тега .
    Форма записи: WIDTH=num или WIDTH=num%, где num —

    численное значение ширины всей таблицы в пикселах или в процентах от всего размера окна. Заметим, что допустимо задавать значения, большие 100%, хотя трудно представить себе случай, где это необходимо. Пример:
    .

    Ширина и высота таблицы WIDTH (ширина таблицы) и HEIGHT (высота таблицы) тега . Форма записи: WIDTH=num или WIDTH=num%,

    Слайд 17ПРИМЕР:



    № пп
    ФИО
    Тема доклада


    Таблица содержит

    1 строку,
    3 столбца

    ПРИМЕР:			 № пп		 ФИО			 Тема доклада	Таблица содержит 1 строку, 3 столбца

    Слайд 18Объединение ячеек
    Ячейка, захватывающая две строки
    Ячейка, захватывающая два столбца

    Объединение ячеекЯчейка, захватывающая две строкиЯчейка, захватывающая два столбца

    Обратная связь

    Если не удалось найти и скачать доклад-презентацию, Вы можете заказать его на нашем сайте. Мы постараемся найти нужный Вам материал и отправим по электронной почте. Не стесняйтесь обращаться к нам, если у вас возникли вопросы или пожелания:

    Email: Нажмите что бы посмотреть 

    Что такое TheSlide.ru?

    Это сайт презентации, докладов, проектов в PowerPoint. Здесь удобно  хранить и делиться своими презентациями с другими пользователями.


    Для правообладателей

    Яндекс.Метрика