Основы языка разметки гипертекста презентация

Оглавление
Урок 1
Урок 2
Урок 3
Урок 4
Урок 5
Урок 6
Урок 7
Урок 8

Урок 1
Введение в HTML, история, работа с текстом

Понятия: HTML, web-сайта
HTML (от англ. Hypertext Markup Language — «язык разметки гипертекста») - это стандартный язык разметки документов во Всемирной паутине. Все web-страницы создаются при помощи языка HTML (специальных управляющих символов – тегов).
Web-сайт состоит из Web-страниц (обычно это файлы с расширением .html или htm), объединенных гиперссылками. Web-страницы могут быть интерактивными и могут содержать мультимедийные и динамические объекты.
ГЛАВНЫЙ ФАЙЛ НАЗЫВАЕТСЯ index.html или index.htm

Пример структуры сайта
Схема 1
2 урок

Достоинства HTML
Возможность просмотра на любых ПК, под управлением различных операционных систем (Windows, Linux, Unix, BSD, MacOS, OS/2...)
Малый информационный объем

История
1986 г - Standard Generalized Markup Language (SGML), международная организация по стандартизации (ISO)
1991 г – создан HTML (сотрудники Европейского института физики частиц), для Mosaic (22 тега)
1993 г – HTML версия 1.3 (43 тега)
1995 г - HTML версия 2.0
1996 г - HTML версия 3.0 (таблицы стилей CSS )
1997 г - HTML версия 4.0 (фреймы, сложные таблицы…)
2005 г – начата разработка версии 5.0 (Консорциумом Всемирной паутины (W3C) )

Виды тегов
Парные (c закрытием, контейнер)
Текс
Не парные (одинарные)

Структура HTML

Мета - теги
Помещаются между тегами ...
Служат для детального описания страницы content="text/html; charset=windows-1251">
...

Спецсимволы
Иногда возникает необходимость в использовании
символа, которого нет на клавиатуре или не
воспринемается если мы его напечатаем в документе.

Форматирование текста

Форматирование текста. Пример.
HTML - код
Заголовок
Пробный текст
Вид на экране
Пробный текст

Форматирование текста
Размерами и начертаниями шрифта можно управлять также с помощью тега FONT и его атрибутов:
...
Например:
Текст
Цвет текста можно задать следующим образом:
Текст
или
Текст

Таблица цветов

Выравнивание текста

Сочетания тегов
Теги можно комбинировать друг с другом получая нужный результат. Например, напечатать на экране жирным курсивом текст. Очередность сочений не имеет значения.
Код HTML:
Сочетание тегов
Текст

Сочетания тегов
Код HTML:
Сочетание тегов
Текст

Урок 2
Выполните задание №1Выполните задание №1, Выполните задание №1, №2 в классе.

Урок 3
Списки и изображения

Списки
Нумерованные
Маркированные
Возможно создавать вложенные
списки

Списки
Располагается внутри контейнера
...
(нумерованный список) или
...
(маркированный список)
А каждый элемент определяется тегами
…

Маркированный список
HTML код:
Прикладное ПО:
СУБД
Текстовые редакторы
Графические редакторы
Графические редакторы
Вид на экране
Прикладное ПО :
СУБД
Текстовые редакторы
Графические редакторы
Графические редакторы

Нумерованный список
HTML код:
Прикладное ПО:
Системное ПО
Прикладное ПО
Системы программирование
Вид на экране:
Прикладное ПО:
Системное ПО
Прикладное ПО
Системы программирование

Нумерованный список
По умолчанию элементы списка нумеруются по порядку 1, 2, 3…
При помощи атрибута TYPE можно изменить стиль нумерации.

Нумерованный список

Нумерованный список*
При помощи атрибутов START VALUE можно изменить порядок нумерации списка.
START - служит для задания начального номера списка, отличного от 1.
VALUE - дает возможность назначить произвольный номер любому элементу списка.
Пример:

Вложенный список
ПО:
Системное ПО
Прикладное ПО
СУБД
Текстовые редакторы
Графические редакторы
Графические редакторы
Системы программирование
HTML код: Вид на экране

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

Вставка изображений. Форматы.

Вставка изображений. Gif *
256 цветов
поддерживает загрузку файла с чередованием строк
возможен прозрачный фон
осуществляет анимацию изображения
Используют для рисунков и gif-анимации

Вставка изображений. JPEG *
16 млн. цветов
фотографическое качество изображений
позволяет задать еще более высокую степень сжатия за счет потери качества
Используют для фотографий

Вставка изображений. PNG *
281 трлн. цветов
поддерживает загрузку файла с чередованием строк
возможен прозрачный фон (с различной степенью прозрачности)
помехоустойчивый, осуществляет проверку на ошибки при передаче файлов
Используют для фотографий

Вставка изображений. Примеры
Изображение risunok.gif находится в той же папке
что и html файл SRC="katalog/risunok.gif">
Изображение risunok.gif находится в папке
katalog по отношению к html файлу
Находится на компьютере в папке
c:\site\risunok.gif
Находится на сайте http://test.ru/

Самостоятельная работа
Выполните задания №3, №4

Урок 4
Гиперссылки, графическое оформление

Гиперссылка
Гиперссылка — это связь между веб-страницами или файлами.
Гиперссылка на Web-странице существует в форме указателя ссылки, щелчок по которому обеспечивает переход на Web-страницу, указанную в адресной части ссылки.
Часто гиперссылка указывает на другую веб-страницу, но может также указывать на рисунок, мультимедийный файл, адрес электронной почты или программу.
См. схема 1.

Гиперссылки. Формат.

Гиперссылки. Примеры.
Ссылки с абсолютным адресом
Персональная страничка
Сылка на файл
Ссылки с относительным адресом HREF="file.html">Персональная страничка
Сылка на файл
Ссылка на страничку
Ссылки на e-mail
E-mail для связи

Гипперссылка в виде изображения
Вокруг изображения-ссылки автоматически добавляется
рамка толщиной один пиксел и цветом, совпадающим с
цветом текстовых ссылок.
Чтобы убрать рамку, следует у тега
установить параметр
border="0"

Гиперссылка в пределах страницы*
Чтобы построить ссылку на область внутри текущей
страницы, надо дать этой области название при
помощи атрибута NAME тэга
. Имя должно
содержать только буквы и цифры.
Таким образом можно делать гиперссылки, указывающие на
области других страниц внутри сайта.
HTML - код
Наверх страницы
В то место, куда надо сделать переход надо вставить:

Графическое оформление
Цвет фона веб-страницы задается с использованием
параметра bgcolor тега .
HTML - код :
... bgcolor="blue">
...
Цвет можно указывать в шестнадцатеричном значении
или по его имени.

Графическое оформление
В качестве фона можно использовать любое подходящее для
этого изображение. Фон не должен отвлекать внимание от
текста, при этом должен хорошо сочетаться с цветовой гаммой
веб-страницы и быть маленьким по размеру.
Цвет фона веб-страницы задается с использованием атрибута
(параметра) background тега .
HTML – код:
...
...
Internet Explorer позволяет сделать фон неподвижным с помощью
параметра bgproperties="fixed" тега .

Урок 5
Выполните задание №5, 6

Урок 6
Таблицы

Таблицы
Для создания таблицы служит тэг
. Как известно таблица состоит из строк, а
строки, в свою очередь состоят из ячеек. Для определения строк служит тэг
, для создания ячеек -
,
.
Слайд 47
Таблицы
HTML-код:
1
2
3
4
5
6
Вид на экране:
Слайд 48
Таблицы
Для создания заголовка таблицы служит тэг
.
По умолчанию браузер располагает заголовок таблицы по
центру над ней. При помощи атрибута ALIGN со значением bottom можно разместить заголовок под таблицей.
HTML-код:
Заголовок таблицы
1
2
Вид на экране:
Слайд 49
Таблицы
Для выравнивания данных в таблице предназначены атрибуты ALIGN, VALIGN.
Атрибут ALIGN предназначен для выравнивания
по горизонтали. По умолчанию содержимое заголовков выравнивается по центру, а ячеек - влево.
Атрибут VALIGN выравнивает данные по вертикали.
HTML-код:
1111
2222
22222
Нижняя ячейка
Нижняя ячейка
Вид на экране:
Слайд 50
Таблицы
Ширина таблицы задается атрибутом WIDTH. Значение можно задавать как в абсолютных единицах (WIDTH=250),
так и в относительных (WIDTH="80%").
HTML-код:
Ширина 200 пикселей
Ширина 60%
Вид на экране:
Слайд 51
Таблицы
При помощи атрибутов COLSPAN, ROWSPAN можно объединять несколько соседних ячеек столбца или строки
в одну большую ячейку.
Атрибут COLSPAN тэгов
,
позволяет сделать слияние ячеек нескольких столбцов в пределах одной строки.
Атрибут ROWSPAN - ячеек из нескольких строк в пределах одного столбца.
Цифра, указываемая в этих атрибутах, указывает количество ячеек, которые будут подвергнуты слиянию.
Слайд 52
Таблицы
HTML-код:
1111
22222
33333
44444
55555
66666
77777
88888
99999
Вид на экране:
Слайд 53
Урок 7
Выполните задание № 7
Имя файла: Основы-языка-разметки-гипертекста.pptx
Количество просмотров: 26
Количество скачиваний: 0
Скачать
- Предыдущая
Animals in our life
Следующая -
Слово о полку Игореве
Похожие презентации
Урок по информатике в 5 классе по теме Кодирование информации
Unit 02: Computer Systems
Сетевая структура на местности
Защита персональных данных. Основы, нормативно-правовая база, примеры
Использование 1С
Клавиатура – устройство ввода информации в память компьютера
Приложения для изучения иностранных языков
Знакомство с Oracle. Модели данных. Реляционная алгебра (лекция 2)
Самые обсуждаемые темы красноярских СМИ
Алгоритмы и программирование. Типы данных и отладка
Hardware: keyboard
Информация вокруг нас
Machine Learning Algorithms. Lecture 1
Обслуживание диска. Жесткий диск
Алгоритмы внутренней сортировки. (Тема 1.2)
Page templates and functionality
Применение искусственных нейронных сетей в экономике
Использование ИКТ в образовательном процессе
Система межведомственного электронного взаимодействия Санкт-Петербурга
Лидер будущего
Обережно – шахрайство
Программа для автосервиса
Представление о программных средах компьютерной графики и черчения
Создание таблицы в текстовом редакторе Microsoft Word 2010 и её редактирование с помощью вкладки Макет
Презентация по теме Передача информации 5 класс
Основи програмування в пакеті Scilab
Персональный компьютер
Қолданбалы бағдарламалар
Обратная связь
Email:
Нажмите что бы посмотреть
window.__NUXT__=(function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q,R){return {data:{meta:{result:{meta:{h1:l,main_text:a,main_title:m,main_description:n,main_keywords:o,main_image:a},app:{logo_image:p,logo_image_width:q,logo_image_height:r,logo_text:a,image_width_full:s,image_width_min:t,recaptcha_key:u,yandex_search:v,ya_context:c,banner_1:a,banner_2:a,banner_3:a,banner_4:a,banner_5:a,banner_6:a,banner_7:a,banner_8:a,banner_9:a,banner_10:a,email:w,footer_before:a,footer:a,dark_theme:c,strategy:{image_alt_words:h,item_slide_header:x,item_images:y,item_images_tag:z,item_words_h3:c,item_words_tag:A,item_words_1:h,routing:B,item_slide_skipping:C,item_download_timeout:D,item_slider_width:E,item_show_pdf:e,item_show_contents:e,item_show_filename:e},colors:{header_text:j,header_bg:i,accent:i}},social:F}},item:{result:{id:427554,name:k,category:G,count:54,jpg:"jpg\u002F427554",hits:H,download:b,h1:"Основы языка разметки гипертекста презентация",meta:{h1:k,title:k,description:"Основы языка разметки гипертекста презентация на тему, доклад, Информатика",keywords:"Основы языка разметки гипертекста, презентация, доклад, проект, скачать, на тему, PowerPoint, урок, класс, школа, Информатика",download_link:a},text:"Вы можете изучить и скачать доклад-презентацию на тему Презентация на тему Основы языка разметки гипертекста из раздела Информатика. Презентация на заданную тему содержит 54 слайдов. Для просмотра воспользуйтесь проигрывателем, если материал оказался полезным для Вас - поделитесь им с друзьями с помощью социальных кнопок и добавьте наш сайт презентаций в закладки!",seo_text:"\u003Cp\u003EОглавление\u003Cbr\u003E\u003Cp\u003EУрок 1 \u003Cbr\u003EУрок 2\u003Cbr\u003EУрок 3\u003Cbr\u003EУрок 4\u003Cbr\u003EУрок 5\u003Cbr\u003EУрок 6\u003Cbr\u003EУрок 7\u003Cbr\u003EУрок 8 \u003Cbr\u003E \u003Cp\u003EУрок 1\u003Cbr\u003E\u003Cp\u003EВведение в HTML, история, работа с текстом\u003Cbr\u003E",file:"Основы-языка-разметки-гипертекста.pptx",texts:["\u003Cp\u003EОсновы языка разметки гипертекста\u003Cbr\u003E","\u003Cp\u003EОглавление\u003Cbr\u003E\u003Cp\u003EУрок 1 \u003Cbr\u003EУрок 2\u003Cbr\u003EУрок 3\u003Cbr\u003EУрок 4\u003Cbr\u003EУрок 5\u003Cbr\u003EУрок 6\u003Cbr\u003EУрок 7\u003Cbr\u003EУрок 8 \u003Cbr\u003E","\u003Cp\u003EУрок 1\u003Cbr\u003E\u003Cp\u003EВведение в HTML, история, работа с текстом\u003Cbr\u003E","\u003Cp\u003EПонятия: HTML, web-сайта\u003Cbr\u003E\u003Cp\u003EHTML (от англ. Hypertext Markup Language — «язык разметки гипертекста») - это стандартный язык разметки документов во Всемирной паутине. Все web-страницы создаются при помощи языка HTML (специальных управляющих символов – тегов).\u003Cbr\u003EWeb-сайт состоит из Web-страниц (обычно это файлы с расширением .html или htm), объединенных гиперссылками. Web-страницы могут быть интерактивными и могут содержать мультимедийные и динамические объекты.\u003Cbr\u003EГЛАВНЫЙ ФАЙЛ НАЗЫВАЕТСЯ index.html или index.htm\u003Cbr\u003E","\u003Cp\u003EПример структуры сайта\u003Cbr\u003E\u003Cp\u003EСхема 1\u003Cbr\u003E\u003Cp\u003E2 урок\u003Cbr\u003E","\u003Cp\u003EДостоинства HTML\u003Cbr\u003E\u003Cp\u003EВозможность просмотра на любых ПК, под управлением различных операционных систем (Windows, Linux, Unix, BSD, MacOS, OS\u002F2...)\u003Cbr\u003EМалый информационный объем\u003Cbr\u003E","\u003Cp\u003EИстория\u003Cbr\u003E\u003Cp\u003E1986 г - Standard Generalized Markup Language (SGML), международная организация по стандартизации (ISO) \u003Cbr\u003E1991 г – создан HTML (сотрудники Европейского института физики частиц), для Mosaic (22 тега)\u003Cbr\u003E1993 г – HTML версия 1.3 (43 тега)\u003Cbr\u003E1995 г - HTML версия 2.0 \u003Cbr\u003E1996 г - HTML версия 3.0 (таблицы стилей CSS )\u003Cbr\u003E1997 г - HTML версия 4.0 (фреймы, сложные таблицы…)\u003Cbr\u003E2005 г – начата разработка версии 5.0 (Консорциумом Всемирной паутины (W3C) ) \u003Cbr\u003E","\u003Cp\u003EВиды тегов\u003Cbr\u003E\u003Cp\u003EПарные (c закрытием, контейнер)\u003Cbr\u003E\u003Chtml\u003E\u003Cbr\u003E\u003C\u002Fhtml\u003E\u003Cbr\u003EТекс\u003Cbr\u003E\u003C\u002Fp\u003E\u003Cbr\u003EНе парные (одинарные)\u003Cbr\u003E\u003Cbr\u003E","\u003Cp\u003EСтруктура HTML\u003Cbr\u003E","\u003Cp\u003EМета - теги\u003Cbr\u003E\u003Cp\u003EПомещаются между тегами \u003Chead\u003E ... \u003C\u002Fhead\u003E\u003Cbr\u003EСлужат для детального описания страницы\u003Cbr\u003E\u003Chead\u003E\u003Cbr\u003E\u003Cmeta http-equiv=\"Content-Type\" content=\"text\u002Fhtml; charset=windows-1251\"\u003E\u003Cbr\u003E\u003Cmeta name=\"Description\" content=\"Краткое описание содержания страницы\"\u003E\u003Cbr\u003E\u003Cmeta name=\"Keywords\" content=\"ключевые слова документа, разделенные запятыми или пробелами\"\u003E\u003Cbr\u003E...\u003Cbr\u003E\u003C\u002Fhead\u003E\u003Cbr\u003E","\u003Cp\u003EСпецсимволы\u003Cbr\u003E\u003Cp\u003EИногда возникает необходимость в использовании\u003Cbr\u003Eсимвола, которого нет на клавиатуре или не\u003Cbr\u003Eвоспринемается если мы его напечатаем в документе.\u003Cbr\u003E","\u003Cp\u003EФорматирование текста\u003Cbr\u003E","\u003Cp\u003EФорматирование текста. Пример.\u003Cbr\u003E\u003Cp\u003EHTML - код\u003Cbr\u003E\u003Chtml\u003E\u003Cbr\u003E\u003Chead\u003E\u003Cbr\u003E\u003Ctitle\u003EЗаголовок\u003C\u002Ftitle\u003E\u003Cbr\u003E\u003C\u002Fhead\u003E\u003Cbr\u003E\u003Cbody\u003E\u003Cbr\u003E\u003Cb\u003EПробный текст\u003C\u002Fb\u003E\u003Cbr\u003E\u003C\u002Fbody\u003E\u003Cbr\u003E\u003C\u002Fhtml\u003E\u003Cbr\u003E\u003Cp\u003EВид на экране\u003Cbr\u003EПробный текст\u003Cbr\u003E","\u003Cp\u003EФорматирование текста\u003Cbr\u003E\u003Cp\u003EРазмерами и начертаниями шрифта можно управлять также с помощью тега FONT и его атрибутов:\u003Cbr\u003E\u003Cbr\u003E\u003Cbr\u003E\u003CFONT FACE=\"Шрифт\" SIZE=\"Размер\"\u003E ... \u003C\u002FFONT\u003E\u003Cbr\u003EНапример: \u003CFONT FACE=\"Arial\" SIZE=\"5\"\u003EТекст\u003C\u002FFONT\u003E\r\n\u003Cbr\u003EЦвет текста можно задать следующим образом:\u003Cbr\u003E\u003CFONT COLOR=“red”\u003EТекст\u003C\u002FFONT\u003E\u003Cbr\u003Eили\u003Cbr\u003E\u003CFONT COLOR=“#FF0000”\u003EТекст\u003C\u002FFONT\u003E\u003Cbr\u003E","\u003Cp\u003EТаблица цветов\u003Cbr\u003E","\u003Cp\u003EВыравнивание текста\u003Cbr\u003E","\u003Cp\u003EСочетания тегов\u003Cbr\u003E\u003Cp\u003EТеги можно комбинировать друг с другом получая нужный результат. Например, напечатать на экране жирным курсивом текст. Очередность сочений не имеет значения.\u003Cbr\u003EКод HTML:\u003Cbr\u003E\u003Chtml\u003E\u003Cbr\u003E\u003Chead\u003E\u003Cbr\u003E\u003Ctitle\u003EСочетание тегов\u003C\u002Ftitle\u003E\u003Cbr\u003E\u003C\u002Fhead\u003E\u003Cbr\u003E\u003Cbody\u003E\u003Cbr\u003E\u003CB\u003E\u003CI\u003E Текст \u003C\u002FB\u003E\u003C\u002FI\u003E\u003Cbr\u003E\u003C\u002Fbody\u003E\u003Cbr\u003E\u003C\u002Fhtml\u003E \u003Cbr\u003E","\u003Cp\u003EСочетания тегов\u003Cbr\u003EКод HTML:\u003Cbr\u003E\u003Chtml\u003E\u003Cbr\u003E\u003Chead\u003E\u003Cbr\u003E\u003Ctitle\u003EСочетание тегов\u003C\u002Ftitle\u003E\u003Cbr\u003E\u003C\u002Fhead\u003E\u003Cbr\u003E\u003Cbody\u003E\u003Cbr\u003E\u003CP ALIGN=\"CENTER\"\u003E\u003Cbr\u003E\u003CH1\u003E Текст \u003C\u002FH1\u003E\u003Cbr\u003E\u003C\u002FP\u003E\u003Cbr\u003E\u003C\u002Fbody\u003E\u003Cbr\u003E\u003C\u002Fhtml\u003E \u003Cbr\u003E","\u003Cp\u003EУрок 2\u003Cbr\u003E\u003Cp\u003EВыполните задание №1Выполните задание №1, Выполните задание №1, №2 в классе.\u003Cbr\u003E","\u003Cp\u003EУрок 3\u003Cbr\u003E\u003Cp\u003EСписки и изображения\u003Cbr\u003E","\u003Cp\u003EСписки\u003Cbr\u003E\u003Cp\u003EНумерованные\u003Cbr\u003EМаркированные\u003Cbr\u003EВозможно создавать вложенные\u003Cbr\u003Eсписки\u003Cbr\u003E","\u003Cp\u003EСписки\u003Cbr\u003E\u003Cp\u003EРасполагается внутри контейнера \u003COL\u003E... \u003C\u002FOL\u003E (нумерованный список) или \u003CUL\u003E... \u003C\u002FUL\u003E (маркированный список)\u003Cbr\u003EА каждый элемент определяется тегами \u003CLI\u003E…\u003C\u002FLI\u003E\u003Cbr\u003E","\u003Cp\u003EМаркированный список\u003Cbr\u003E\u003Cp\u003EHTML код:\u003Cbr\u003E\u003Chtml\u003E\u003Cbr\u003E\u003Cbody\u003E\u003Cbr\u003E\u003Cp\u003EПрикладное ПО:\u003C\u002Fp\u003E\u003Cbr\u003E\u003Cul\u003E\u003Cbr\u003E\u003Cli\u003EСУБД\u003C\u002Fli\u003E\u003Cbr\u003E\u003Cli\u003EТекстовые редакторы\u003C\u002Fli\u003E\u003Cbr\u003E\u003Cli\u003EГрафические редакторы\u003C\u002Fli\u003E\u003Cbr\u003E\u003Cli\u003EГрафические редакторы\u003C\u002Fli\u003E\u003Cbr\u003E\u003C\u002Ful\u003E\u003Cbr\u003E\u003C\u002Fbody\u003E\u003Cbr\u003E\u003C\u002Fhtml\u003E\u003Cbr\u003E\u003Cp\u003EВид на экране\u003Cbr\u003EПрикладное ПО :\u003Cbr\u003EСУБД\u003Cbr\u003EТекстовые редакторы\u003Cbr\u003EГрафические редакторы\u003Cbr\u003EГрафические редакторы\u003Cbr\u003E\u003Cbr\u003E","\u003Cp\u003EНумерованный список\u003Cbr\u003E\u003Cp\u003EHTML код:\u003Cbr\u003E\u003Chtml\u003E\u003Cbr\u003E\u003Cbody\u003E\u003Cbr\u003E\u003Cp\u003EПрикладное ПО:\u003C\u002Fp\u003E\u003Cbr\u003E\u003Col\u003E\u003Cbr\u003E\u003Cli\u003EСистемное ПО\u003C\u002Fli\u003E\u003Cbr\u003E\u003Cli\u003EПрикладное ПО\u003C\u002Fli\u003E\u003Cbr\u003E\u003Cli\u003EСистемы программирование\u003C\u002Fli\u003E\u003Cbr\u003E\u003C\u002Fol\u003E\u003Cbr\u003E\u003C\u002Fbody\u003E\u003Cbr\u003E\u003C\u002Fhtml\u003E\u003Cbr\u003E\u003Cp\u003EВид на экране:\u003Cbr\u003EПрикладное ПО:\u003Cbr\u003EСистемное ПО \u003Cbr\u003EПрикладное ПО \u003Cbr\u003EСистемы программирование \u003Cbr\u003E","\u003Cp\u003EНумерованный список\u003Cbr\u003E\u003Cp\u003EПо умолчанию элементы списка нумеруются по порядку 1, 2, 3… \u003Cbr\u003EПри помощи атрибута TYPE можно изменить стиль нумерации.\u003Cbr\u003E\u003Cbr\u003E","\u003Cp\u003EНумерованный список\u003Cbr\u003E","\u003Cp\u003EНумерованный список*\u003Cbr\u003E\u003Cp\u003EПри помощи атрибутов START VALUE можно изменить порядок нумерации списка.\u003Cbr\u003ESTART - служит для задания начального номера списка, отличного от 1.\u003Cbr\u003EVALUE - дает возможность назначить произвольный номер любому элементу списка.\u003Cbr\u003EПример:\u003Cbr\u003E","\u003Cp\u003EВложенный список\u003Cbr\u003E\u003Cp\u003E\u003Chtml\u003E\u003Cbr\u003E\u003Cbody\u003E\u003Cbr\u003E\u003Cp\u003EПО:\u003C\u002Fp\u003E\u003Cbr\u003E\u003Col\u003E\u003Cbr\u003E\u003Cli\u003EСистемное ПО\u003C\u002Fli\u003E\u003Cbr\u003E\u003Cli\u003EПрикладное ПО\u003C\u002Fli\u003E\u003Cbr\u003E \u003Cul\u003E\u003Cbr\u003E \u003Cli\u003EСУБД\u003C\u002Fli\u003E\u003Cbr\u003E \u003Cli\u003EТекстовые редакторы\u003C\u002Fli\u003E\u003Cbr\u003E \u003Cli\u003EГрафические редакторы\u003C\u002Fli\u003E\u003Cbr\u003E \u003Cli\u003EГрафические редакторы\u003C\u002Fli\u003E\u003Cbr\u003E \u003C\u002Ful\u003E\u003Cbr\u003E\u003Cli\u003EСистемы программирование\u003C\u002Fli\u003E\u003Cbr\u003E\u003C\u002Fol\u003E\u003Cbr\u003E\u003C\u002Fbody\u003E\u003Cbr\u003E\u003C\u002Fhtml\u003E\u003Cbr\u003E\u003Cp\u003EHTML код: Вид на экране\u003Cbr\u003E","\u003Cp\u003EВставка изображений\u003Cbr\u003E\u003Cp\u003EДля встраивания изображения в документ используется тег\u003Cbr\u003E\u003CIMG\u003E, имеющий обязательный параметр src, который\u003Cbr\u003Eопределяет адрес файла с картинкой и alt, определяющий\u003Cbr\u003Eальтернативный текст.\u003Cbr\u003E","\u003Cp\u003EВставка изображений. Форматы.\u003Cbr\u003E","\u003Cp\u003EВставка изображений. Gif *\u003Cbr\u003E\u003Cp\u003E256 цветов\u003Cbr\u003Eподдерживает загрузку файла с чередованием строк \u003Cbr\u003Eвозможен прозрачный фон \u003Cbr\u003Eосуществляет анимацию изображения \u003Cbr\u003EИспользуют для рисунков и gif-анимации\u003Cbr\u003E","\u003Cp\u003EВставка изображений. JPEG *\u003Cbr\u003E\u003Cp\u003E16 млн. цветов\u003Cbr\u003Eфотографическое качество изображений \u003Cbr\u003Eпозволяет задать еще более высокую степень сжатия за счет потери качества \u003Cbr\u003EИспользуют для фотографий\u003Cbr\u003E","\u003Cp\u003EВставка изображений. PNG *\u003Cbr\u003E\u003Cp\u003E281 трлн. цветов\u003Cbr\u003Eподдерживает загрузку файла с чередованием строк \u003Cbr\u003Eвозможен прозрачный фон (с различной степенью прозрачности) \u003Cbr\u003Eпомехоустойчивый, осуществляет проверку на ошибки при передаче файлов \u003Cbr\u003EИспользуют для фотографий\u003Cbr\u003E","\u003Cp\u003EВставка изображений. Примеры\u003Cbr\u003E\u003Cp\u003E\u003CIMG SRC=\"risunok.gif\"\u003E\u003Cbr\u003EИзображение risunok.gif находится в той же папке\u003Cbr\u003Eчто и html файл\u003Cbr\u003E\u003CIMG SRC=\"katalog\u002Frisunok.gif\"\u003E\u003Cbr\u003EИзображение risunok.gif находится в папке\u003Cbr\u003Ekatalog по отношению к html файлу\u003Cbr\u003E\u003CIMG SRC=\"c:\\site\\risunok.gif\"\u003E\u003Cbr\u003EНаходится на компьютере в папке\u003Cbr\u003Ec:\\site\\risunok.gif\u003Cbr\u003E\u003CIMG SRC=\"http:\u002F\u002Ftest.ru\u002Frisunok.gif\"\u003E\u003Cbr\u003EНаходится на сайте http:\u002F\u002Ftest.ru\u002F\u003Cbr\u003E\u003Cbr\u003E","\u003Cp\u003EСамостоятельная работа\u003Cbr\u003E\u003Cp\u003EВыполните задания №3, №4\u003Cbr\u003E","\u003Cp\u003EУрок 4\u003Cbr\u003E\u003Cp\u003EГиперссылки, графическое оформление\u003Cbr\u003E","\u003Cp\u003EГиперссылка\u003Cbr\u003E\u003Cp\u003EГиперссылка — это связь между веб-страницами или файлами. \u003Cbr\u003EГиперссылка на Web-странице существует в форме указателя ссылки, щелчок по которому обеспечивает переход на Web-страницу, указанную в адресной части ссылки.\u003Cbr\u003EЧасто гиперссылка указывает на другую веб-страницу, но может также указывать на рисунок, мультимедийный файл, адрес электронной почты или программу.\u003Cbr\u003EСм. схема 1.\u003Cbr\u003E","\u003Cp\u003EГиперссылки. Формат.\u003Cbr\u003E","\u003Cp\u003EГиперссылки. Примеры.\u003Cbr\u003E\u003Cp\u003EСсылки с абсолютным адресом\u003Cbr\u003E\u003CA HREF=\"http:\u002F\u002Frusinov.name\"\u003EПерсональная страничка\u003C\u002Fa\u003E\u003Cbr\u003E\u003CA HREF=\"c:\\site\\index.html\"\u003EСылка на файл\u003C\u002Fa\u003E\u003Cbr\u003EСсылки с относительным адресом\u003Cbr\u003E\u003CA HREF=\"file.html\"\u003EПерсональная страничка\u003C\u002Fa\u003E\u003Cbr\u003E\u003CA HREF=\"big\u002Fpic.gif\"\u003EСылка на файл\u003C\u002Fa\u003E\u003Cbr\u003E\u003CA HREF=“\u002Fsmall\u002Fgol.html\"\u003EСсылка на страничку\u003C\u002Fa\u003E\u003Cbr\u003EСсылки на e-mail\u003Cbr\u003E\u003CA HREF=\"mailto:[e-mail]\"\u003EE-mail для связи\u003C\u002FA\u003E \u003Cbr\u003E\u003Cbr\u003E","\u003Cp\u003EГипперссылка в виде изображения\u003Cbr\u003E\u003Cp\u003E\u003CA HREF=\"http:\u002F\u002Frusinov.name\"\u003E\u003Cimg src=\"sample.gif\"\u003E \u003C\u002Fa\u003E\u003Cbr\u003EВокруг изображения-ссылки автоматически добавляется \u003Cbr\u003Eрамка толщиной один пиксел и цветом, совпадающим с\u003Cbr\u003Eцветом текстовых ссылок. \u003Cbr\u003EЧтобы убрать рамку, следует у тега \u003CIMG\u003E установить параметр\u003Cbr\u003Eborder=\"0\" \u003Cbr\u003E","\u003Cp\u003EГиперссылка в пределах страницы*\u003Cbr\u003E\u003Cp\u003EЧтобы построить ссылку на область внутри текущей\u003Cbr\u003Eстраницы, надо дать этой области название при\u003Cbr\u003Eпомощи атрибута NAME тэга \u003CA\u003E. Имя должно\u003Cbr\u003Eсодержать только буквы и цифры.\u003Cbr\u003EТаким образом можно делать гиперссылки, указывающие на\u003Cbr\u003Eобласти других страниц внутри сайта.\u003Cbr\u003EHTML - код\u003Cbr\u003E\u003Ca href=\"#Начало страницы\"\u003EНаверх страницы\u003C\u002Fa\u003E\u003Cbr\u003EВ то место, куда надо сделать переход надо вставить:\u003Cbr\u003E\u003Ca name=\"Начало страницы\"\u003E\u003C\u002Fa\u003E \u003Cbr\u003E","\u003Cp\u003EГрафическое оформление\u003Cbr\u003E\u003Cp\u003EЦвет фона веб-страницы задается с использованием\u003Cbr\u003Eпараметра bgcolor тега \u003CBODY\u003E.\u003Cbr\u003EHTML - код :\u003Cbr\u003E\u003Chtml\u003E\u003Cbr\u003E\u003Chead\u003E\u003Cbr\u003E...\u003Cbr\u003E\u003C\u002Fhead\u003E\u003Cbr\u003E\u003Cbody bgcolor=\"blue\"\u003E\u003Cbr\u003E\u003Cp\u003E...\u003C\u002Fp\u003E\u003Cbr\u003E\u003C\u002Fbody\u003E\u003Cbr\u003E\u003C\u002Fhtml\u003E\u003Cbr\u003EЦвет можно указывать в шестнадцатеричном значении\u003Cbr\u003Eили по его имени. \u003Cbr\u003E","\u003Cp\u003EГрафическое оформление\u003Cbr\u003E\u003Cp\u003EВ качестве фона можно использовать любое подходящее для\u003Cbr\u003Eэтого изображение. Фон не должен отвлекать внимание от\u003Cbr\u003Eтекста, при этом должен хорошо сочетаться с цветовой гаммой\u003Cbr\u003Eвеб-страницы и быть маленьким по размеру.\u003Cbr\u003E Цвет фона веб-страницы задается с использованием атрибута\u003Cbr\u003E(параметра) background тега \u003CBODY\u003E.\u003Cbr\u003EHTML – код:\u003Cbr\u003E\u003Chtml\u003E\u003Cbr\u003E\u003Chead\u003E\u003Cbr\u003E...\u003Cbr\u003E\u003C\u002Fhead\u003E\u003Cbr\u003E\u003Cbody background=\"image\u002Fsamplebg.gif\"\u003E\u003Cbr\u003E\u003Cp\u003E...\u003C\u002Fp\u003E\u003Cbr\u003E\u003C\u002Fbody\u003E\u003Cbr\u003E\u003C\u002Fhtml\u003E\u003Cbr\u003EInternet Explorer позволяет сделать фон неподвижным с помощью\u003Cbr\u003Eпараметра bgproperties=\"fixed\" тега \u003CBODY\u003E.\u003Cbr\u003E","\u003Cp\u003EУрок 5\u003Cbr\u003E\u003Cp\u003EВыполните задание №5, 6\u003Cbr\u003E","\u003Cp\u003EУрок 6\u003Cbr\u003E\u003Cp\u003EТаблицы\u003Cbr\u003E","\u003Cp\u003EТаблицы\u003Cbr\u003E\u003Cp\u003EДля создания таблицы служит тэг \u003CTABLE\u003E. Как известно таблица состоит из строк, а строки, в свою очередь состоят из ячеек. Для определения строк служит тэг \u003CTR\u003E, для создания ячеек - \u003CTH\u003E, \u003CTD\u003E.\u003Cbr\u003E","\u003Cp\u003EТаблицы\u003Cbr\u003E\u003Cp\u003EHTML-код:\u003Cbr\u003E\u003Ctable border=\"1\"\u003E\u003Cbr\u003E \u003Ctr\u003E\u003Cbr\u003E \u003Ctd\u003E1\u003C\u002Ftd\u003E\u003Cbr\u003E \u003Ctd\u003E2\u003C\u002Ftd\u003E\u003Cbr\u003E \u003C\u002Ftr\u003E\u003Cbr\u003E \u003Ctr\u003E\u003Cbr\u003E \u003Ctd\u003E3\u003C\u002Ftd\u003E\u003Cbr\u003E \u003Ctd\u003E4\u003C\u002Ftd\u003E\u003Cbr\u003E \u003C\u002Ftr\u003E\u003Cbr\u003E \u003Ctr\u003E\u003Cbr\u003E \u003Ctd\u003E5\u003C\u002Ftd\u003E\u003Cbr\u003E \u003Ctd\u003E6\u003C\u002Ftd\u003E\u003Cbr\u003E \u003C\u002Ftr\u003E\u003Cbr\u003E\u003C\u002Ftable\u003E \u003Cbr\u003E\u003Cp\u003EВид на экране:\u003Cbr\u003E","\u003Cp\u003EТаблицы\u003Cbr\u003E\u003Cp\u003EДля создания заголовка таблицы служит тэг \u003CCAPTION\u003E.\u003Cbr\u003EПо умолчанию браузер располагает заголовок таблицы по центру над ней. При помощи атрибута ALIGN со значением bottom можно разместить заголовок под таблицей.\u003Cbr\u003E\u003Cp\u003EHTML-код:\u003Cbr\u003E\u003Ctable border=\"1\"\u003E\u003Cbr\u003E\u003Ccaption\u003E Заголовок таблицы \u003C\u002Fcaption\u003E\u003Cbr\u003E \u003Ctr\u003E\u003Cbr\u003E \u003Ctd\u003E1\u003C\u002Ftd\u003E\u003Cbr\u003E \u003Ctd\u003E2\u003C\u002Ftd\u003E\u003Cbr\u003E \u003C\u002Ftr\u003E\u003Cbr\u003E\u003C\u002Ftable\u003E \u003Cbr\u003E\u003Cp\u003EВид на экране:\u003Cbr\u003E","\u003Cp\u003EТаблицы\u003Cbr\u003E\u003Cp\u003EДля выравнивания данных в таблице предназначены атрибуты ALIGN, VALIGN.\u003Cbr\u003EАтрибут ALIGN предназначен для выравнивания по горизонтали. По умолчанию содержимое заголовков выравнивается по центру, а ячеек - влево.\u003Cbr\u003EАтрибут VALIGN выравнивает данные по вертикали. \u003Cbr\u003E\u003Cp\u003EHTML-код:\u003Cbr\u003E\u003Ctable border=\"1\" cellpadding=\"5\"\u003E\u003Cbr\u003E \u003Ctr\u003E\u003Cbr\u003E \u003Ctd align=\"right\"\u003E1111\u003Cbr\u003E2222\u003C\u002Ftd\u003E\u003Cbr\u003E \u003Ctd valign=\"top\" align=\"center\"\u003E22222\u003C\u002Ftd\u003E\u003Cbr\u003E \u003C\u002Ftr\u003E\u003Cbr\u003E \u003Ctr\u003E\u003Cbr\u003E \u003Ctd\u003EНижняя ячейка\u003C\u002Ftd\u003E\u003Cbr\u003E \u003Ctd\u003EНижняя ячейка\u003C\u002Ftd\u003E\u003Cbr\u003E \u003C\u002Ftr\u003E\u003Cbr\u003E\u003C\u002Ftable\u003E \u003Cbr\u003E\u003Cp\u003EВид на экране:\u003Cbr\u003E","\u003Cp\u003EТаблицы\u003Cbr\u003E\u003Cp\u003EШирина таблицы задается атрибутом WIDTH. Значение можно задавать как в абсолютных единицах (WIDTH=250), так и в относительных (WIDTH=\"80%\"). \u003Cbr\u003E\u003Cp\u003EHTML-код:\u003Cbr\u003E\u003Ctable border=\"1\" width=\"200\"\u003E\u003Cbr\u003E \u003Ctr\u003E\u003Cbr\u003E \u003Ctd\u003E\u003Cp\u003EШирина 200 пикселей\u003C\u002Fp\u003E\u003C\u002Ftd\u003E\u003Cbr\u003E \u003C\u002Ftr\u003E\u003Cbr\u003E\u003C\u002Ftable\u003E\u003Cbr\u003E\u003Cbr\u003E\u003Ctable border=\"1\" width=\"60%\"\u003E\u003Cbr\u003E \u003Ctr\u003E\u003Cbr\u003E \u003Ctd\u003E\u003Cp\u003EШирина 60%\u003C\u002Fp\u003E\u003C\u002Ftd\u003E\u003Cbr\u003E \u003C\u002Ftr\u003E\u003Cbr\u003E\u003C\u002Ftable\u003E \u003Cbr\u003E\u003Cp\u003EВид на экране:\u003Cbr\u003E","\u003Cp\u003EТаблицы\u003Cbr\u003E\u003Cp\u003EПри помощи атрибутов COLSPAN, ROWSPAN можно объединять несколько соседних ячеек столбца или строки в одну большую ячейку.\u003Cbr\u003EАтрибут COLSPAN тэгов \u003CTH\u003E, \u003CTD\u003E позволяет сделать слияние ячеек нескольких столбцов в пределах одной строки.\u003Cbr\u003EАтрибут ROWSPAN - ячеек из нескольких строк в пределах одного столбца.\u003Cbr\u003EЦифра, указываемая в этих атрибутах, указывает количество ячеек, которые будут подвергнуты слиянию.\u003Cbr\u003E","\u003Cp\u003EТаблицы\u003Cbr\u003E\u003Cp\u003EHTML-код:\u003Cbr\u003E\u003Ctable border=\"1\"\u003E\u003Cbr\u003E \u003Ctr\u003E\u003Cbr\u003E \u003Ctd rowspan=\"3\"\u003E1111\u003C\u002Ftd\u003E\u003Cbr\u003E \u003Ctd colspan=\"2\"\u003E22222\u003C\u002Ftd\u003E\u003Cbr\u003E \u003Ctd colspan=\"2\"\u003E33333\u003C\u002Ftd\u003E\u003Cbr\u003E \u003C\u002Ftr\u003E\u003Cbr\u003E \u003Ctr\u003E\u003Cbr\u003E \u003Ctd\u003E44444\u003C\u002Ftd\u003E\u003Cbr\u003E \u003Ctd colspan=\"2\" rowspan=\"2\"\u003E55555\u003C\u002Ftd\u003E\u003Cbr\u003E \u003Ctd\u003E66666\u003C\u002Ftd\u003E\u003Cbr\u003E \u003C\u002Ftr\u003E\u003Cbr\u003E \u003Ctr\u003E\u003Cbr\u003E \u003Ctd\u003E77777\u003C\u002Ftd\u003E\u003Cbr\u003E \u003Ctd\u003E88888\u003C\u002Ftd\u003E\u003Cbr\u003E \u003C\u002Ftr\u003E\u003Cbr\u003E \u003Ctr\u003E\u003Cbr\u003E \u003Ctd colspan=\"5\"\u003E99999\u003C\u002Ftd\u003E\u003Cbr\u003E \u003C\u002Ftr\u003E\u003Cbr\u003E\u003C\u002Ftable\u003E \u003Cbr\u003E\u003Cp\u003EВид на экране:\u003Cbr\u003E","\u003Cp\u003EУрок 7\u003Cbr\u003E\u003Cp\u003EВыполните задание № 7\u003Cbr\u003E","\u003Cp\u003EУрок 8 - зачет\u003Cbr\u003E\u003Cp\u003EВыполните тест\u003Cbr\u003E"],href:"\u002Finformatika\u002Fosnovy-yazyka-razmetki-giperteksta-2",href_category:"\u002Finformatika",date:1659736441,related:[{id:499807,name:"Урок по информатике в 5 классе по теме Кодирование информации",href:"\u002Finformatika\u002Furok-po-informatike-v-5-klasse",jpg:"jpg\u002F499807"},{id:317682,name:"Unit 02: Computer Systems",href:"\u002Finformatika\u002Funit-02-computer-systems",jpg:"jpg\u002F317682"},{id:390862,name:"Сетевая структура на местности",href:"\u002Finformatika\u002Fsetevaya-struktura-na-mestnosti",jpg:"jpg\u002F390862"},{id:342724,name:"Защита персональных данных. Основы, нормативно-правовая база, примеры",href:"\u002Finformatika\u002Fzashchita-personalnyh-dannyh-osnovy-normativno-pravovaya",jpg:"jpg\u002F342724"},{id:424061,name:"Использование 1С",href:"\u002Finformatika\u002Fispolzovanie-1s",jpg:"jpg\u002F424061"},{id:300401,name:"Клавиатура – устройство ввода информации в память компьютера",href:"\u002Finformatika\u002Fklaviatura--ustroystvo-vvoda-informatsii-v",jpg:"jpg\u002F300401"},{id:174782,name:"Приложения для изучения иностранных языков",href:"\u002Finformatika\u002Fprilozheniya-dlya-izucheniya-inostrannyh-yazykov",jpg:"jpg\u002F174782"},{id:8627,name:"Знакомство с Oracle. Модели данных. Реляционная алгебра (лекция 2)",href:"\u002Finformatika\u002Fznakomstvo-s-oracle-modeli-dannyh-relyatsionnaya",jpg:"jpg\u002F8627"},{id:194554,name:"Самые обсуждаемые темы красноярских СМИ",href:"\u002Finformatika\u002Fsamye-obsuzhdaemye-temy-krasnoyarskih-smi",jpg:"jpg\u002F194554"},{id:343836,name:"Алгоритмы и программирование. Типы данных и отладка",href:"\u002Finformatika\u002Falgoritmy-i-programmirovanie-tipy-dannyh-i",jpg:"jpg\u002F343836"},{id:288039,name:"Hardware: keyboard",href:"\u002Finformatika\u002Fhardware-keyboard",jpg:"jpg\u002F288039"},{id:242896,name:"Информация вокруг нас",href:"\u002Finformatika\u002Finformatsiya-vokrug-nas-2",jpg:"jpg\u002F242896"},{id:605418,name:"Machine Learning Algorithms. Lecture 1",href:"\u002Finformatika\u002Fmachine-learning-algorithms-lecture-1",jpg:"jpg\u002F605418"},{id:365904,name:"Обслуживание диска. Жесткий диск",href:"\u002Finformatika\u002Fobsluzhivanie-diska-zhestkiy-disk-1",jpg:"jpg\u002F365904"},{id:253285,name:"Алгоритмы внутренней сортировки. (Тема 1.2)",href:"\u002Finformatika\u002Falgoritmy-vnutrenney-sortirovki-tema-12",jpg:"jpg\u002F253285"},{id:178862,name:"Page templates and functionality",href:"\u002Finformatika\u002Fpage-templates-and-functionality",jpg:"jpg\u002F178862"},{id:431628,name:"Применение искусственных нейронных сетей в экономике",href:"\u002Finformatika\u002Fprimenenie-iskusstvennyh-neyronnyh-setey-v-ekonomike",jpg:"jpg\u002F431628"},{id:580372,name:"Использование ИКТ в образовательном процессе",href:"\u002Finformatika\u002Fispolzovanie-ikt-v-obrazovatelnom-protsesse-5",jpg:"jpg\u002F580372"},{id:160181,name:"Система межведомственного электронного взаимодействия Санкт-Петербурга",href:"\u002Finformatika\u002Fsistema-mezhvedomstvennogo-elektronnogo-vzaimodeystviya-sankt-peterburga",jpg:"jpg\u002F160181"},{id:108735,name:"Лидер будущего",href:"\u002Finformatika\u002Flider-budushchego",jpg:"jpg\u002F108735"},{id:330523,name:"Обережно – шахрайство",href:"\u002Finformatika\u002Foberezhno--shahraystvo",jpg:"jpg\u002F330523"},{id:369288,name:"Программа для автосервиса",href:"\u002Finformatika\u002Fprogramma-dlya-avtoservisa",jpg:"jpg\u002F369288"},{id:259374,name:"Представление о программных средах компьютерной графики и черчения",href:"\u002Finformatika\u002Fpredstavlenie-o-programmnyh-sredah-kompyuternoy-grafiki",jpg:"jpg\u002F259374"},{id:418937,name:"Создание таблицы в текстовом редакторе Microsoft Word 2010 и её редактирование с помощью вкладки Макет",href:"\u002Finformatika\u002Fsozdanie-tablitsy-v-tekstovom-redaktore-microsoft",jpg:"jpg\u002F418937"},{id:519446,name:"Презентация по теме Передача информации 5 класс",href:"\u002Finformatika\u002Fprezentatsiya-po-teme-peredacha-informatsii-5",jpg:"jpg\u002F519446"},{id:293017,name:"Основи програмування в пакеті Scilab",href:"\u002Finformatika\u002Fosnovi-programuvannya-v-paket-scilab",jpg:"jpg\u002F293017"},{id:330252,name:"Персональный компьютер",href:"\u002Finformatika\u002Fpersonalnyy-kompyuter-21",jpg:"jpg\u002F330252"},{id:99337,name:"Қолданбалы бағдарламалар",href:"\u002Finformatika\u002Foldanbaly-badarlamalar-1",jpg:"jpg\u002F99337"}],navigation:{next:"\u002Fliteratura\u002Fslovo-o-polku-igoreve-10",next_name:"Слово о полку Игореве",prev:"\u002Fangliyskiy-yazyk\u002Fanimals-in-our-life-4",prev_name:"Animals in our life"}}},categories:{result:[{id:I,ordering:b,name:"Без категории",pseudoname:"uncategorized"},{id:144,ordering:b,name:"Бизнес",pseudoname:"biznes"},{id:146,ordering:b,name:"Образование",pseudoname:"obrazovanie"},{id:149,ordering:b,name:"Финансы",pseudoname:"finansy"},{id:150,ordering:b,name:"Государство",pseudoname:"gosudarstvo"},{id:152,ordering:b,name:"Спорт",pseudoname:"sport"},{id:154,ordering:b,name:"Армия",pseudoname:"armiya"},{id:156,ordering:b,name:"Культурология",pseudoname:"kulturologiya"},{id:157,ordering:b,name:"Еда и кулинария",pseudoname:"eda-i-kulinariya"},{id:158,ordering:b,name:"Лингвистика",pseudoname:"lingvistika"},{id:163,ordering:b,name:"Черчение",pseudoname:"cherchenie"},{id:164,ordering:b,name:"Физкультура",pseudoname:"fizkultura"},{id:165,ordering:b,name:"ИЗО",pseudoname:"izo"},{id:166,ordering:b,name:"Психология",pseudoname:"psihologiya"},{id:116,ordering:I,name:"Английский язык",pseudoname:"angliyskiy-yazyk"},{id:108,ordering:2,name:"Астрономия",pseudoname:"astronomiya"},{id:104,ordering:3,name:"Алгебра",pseudoname:"algebra"},{id:106,ordering:4,name:"Биология",pseudoname:"biologiya"},{id:142,ordering:5,name:"География",pseudoname:"geografiya"},{id:141,ordering:6,name:"Геометрия",pseudoname:"geometria"},{id:123,ordering:7,name:"Детские презентации",pseudoname:"detskie-prezentatsii"},{id:107,ordering:8,name:G,pseudoname:"informatika"},{id:109,ordering:9,name:"История",pseudoname:"istoriya"},{id:139,ordering:10,name:"Литература",pseudoname:"literatura"},{id:119,ordering:11,name:"Маркетинг",pseudoname:"marketing"},{id:114,ordering:12,name:"Математика",pseudoname:"matematika"},{id:138,ordering:h,name:"Медицина",pseudoname:"medetsina"},{id:118,ordering:14,name:"Менеджмент",pseudoname:"menedzhment"},{id:137,ordering:15,name:"Музыка",pseudoname:"muzyka"},{id:136,ordering:16,name:"МХК",pseudoname:"mhk"},{id:130,ordering:17,name:"Немецкий язык",pseudoname:"nemetskiy-yazyk"},{id:105,ordering:18,name:"ОБЖ",pseudoname:"obzh"},{id:133,ordering:19,name:"Обществознание ",pseudoname:"obshchestvoznanie"},{id:132,ordering:20,name:"Окружающий мир ",pseudoname:"okruzhayushchiy-mir"},{id:131,ordering:21,name:"Педагогика ",pseudoname:"pedagogika"},{id:129,ordering:22,name:"Русский язык",pseudoname:"russkiy-yazyk"},{id:128,ordering:24,name:"Технология",pseudoname:"tehnologiya"},{id:127,ordering:25,name:"Физика",pseudoname:"fizika"},{id:126,ordering:H,name:"Философия",pseudoname:"filosofiya"},{id:125,ordering:27,name:"Химия",pseudoname:"himiya"},{id:124,ordering:29,name:"Экология",pseudoname:"ekologiya"},{id:121,ordering:30,name:"Экономика",pseudoname:"ekonomika"},{id:120,ordering:31,name:"Юриспруденция",pseudoname:"yurisprudentsiya"}]}},state:{},_errors:{},serverRendered:e,config:{public:{SITE_NAME:J,SITE_HOST:"mypreza.com",SITE_LANG:K,API_BASE_URL:"https:\u002F\u002Fmypreza.com\u002Fapi\u002F",pwaManifest:{name:J,short_name:a,description:a,lang:K,start_url:"\u002F?standalone=true",display:"standalone",background_color:j,theme_color:"#000000",icons:[{src:"\u002F_nuxt\u002Ficons\u002F64x64.f2a6e93d.png",type:d,sizes:L,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F64x64.maskable.f2a6e93d.png",type:d,sizes:L,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F120x120.f2a6e93d.png",type:d,sizes:M,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F120x120.maskable.f2a6e93d.png",type:d,sizes:M,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F144x144.f2a6e93d.png",type:d,sizes:N,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F144x144.maskable.f2a6e93d.png",type:d,sizes:N,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F152x152.f2a6e93d.png",type:d,sizes:O,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F152x152.maskable.f2a6e93d.png",type:d,sizes:O,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F192x192.f2a6e93d.png",type:d,sizes:P,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F192x192.maskable.f2a6e93d.png",type:d,sizes:P,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F384x384.f2a6e93d.png",type:d,sizes:Q,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F384x384.maskable.f2a6e93d.png",type:d,sizes:Q,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F512x512.f2a6e93d.png",type:d,sizes:R,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F512x512.maskable.f2a6e93d.png",type:d,sizes:R,purpose:g}]},yandexMetrika:{id:"85004146",metrikaUrl:"https:\u002F\u002Fmc.yandex.ru\u002Fmetrika\u002Ftag.js",accurateTrackBounce:e,childIframe:c,clickmap:c,defer:c,useRuntimeConfig:e,trackHash:c,trackLinks:e,type:b,webvisor:c,triggerEvent:c,consoleLog:e,partytown:c,isDev:c}},app:{baseURL:"\u002F",buildAssetsDir:"\u002F_nuxt\u002F",cdnURL:a}},pinia:{app:{meta:{h1:l,main_text:a,main_title:m,main_description:n,main_keywords:o,main_image:a},app:{logo_image:p,logo_image_width:q,logo_image_height:r,logo_text:a,image_width_full:s,image_width_min:t,recaptcha_key:u,yandex_search:v,ya_context:c,banner_1:a,banner_2:a,banner_3:a,banner_4:a,banner_5:a,banner_6:a,banner_7:a,banner_8:a,banner_9:a,banner_10:a,email:w,footer_before:a,footer:a,dark_theme:c,strategy:{image_alt_words:h,item_slide_header:x,item_images:y,item_images_tag:z,item_words_h3:c,item_words_tag:A,item_words_1:h,routing:B,item_slide_skipping:C,item_download_timeout:D,item_slider_width:E,item_show_pdf:e,item_show_contents:e,item_show_filename:e},colors:{header_text:j,header_bg:i,accent:i}},social:F,token:a}}}}("",0,false,"image\u002Fpng",true,"any","maskable",13,"#d53032","#ffffff","Основы языка разметки гипертекста","Учебные презентации","Презентации в PowerPoint на разные темы","Презентации, проекты, доклады в PowerPoint на разные темы для учебы","Презентация, на тему, урок, класс, PowerPoint, скачати презентацію, фон, шаблон, доклад, проект.","images\u002Fdata\u002Flogo.png",185,40,720,480,"6LeioWIpAAAAAGqMN4KqMVIkekcMW7fBKHjXCd-a","2503267","[e-mail]","h3a","text","none","h3","category","both",80,800,"\u003Cscript src=\"\u002F\u002Fyastatic.net\u002Fes5-shims\u002F0.0.2\u002Fes5-shims.min.js\"\u003E\u003C\u002Fscript\u003E\r\n\u003Cscript src=\"\u002F\u002Fyastatic.net\u002Fshare2\u002Fshare.js\"\u003E\u003C\u002Fscript\u003E\r\n\u003Cdiv class=\"ya-share2\" data-services=\"collections,gplus,vkontakte,facebook,odnoklassniki,gplus,twitter,moimir\" data-counter=\"\"\u003E\u003C\u002Fdiv\u003E","Информатика",26,1,"Mypreza","ru","64x64","120x120","144x144","152x152","192x192","384x384","512x512")) строки, в свою очередь состоят из ячеек. Для определения строк служит тэг

Таблицы
HTML-код:
1
2
3
4
5
6
Вид на экране:

Таблицы
Для создания заголовка таблицы служит тэг

Таблицы
Для выравнивания данных в таблице предназначены атрибуты ALIGN, VALIGN.
Атрибут ALIGN предназначен для выравнивания по горизонтали. По умолчанию содержимое заголовков выравнивается по центру, а ячеек - влево.
Атрибут VALIGN выравнивает данные по вертикали.
HTML-код:
1111
2222
22222
Нижняя ячейка
Нижняя ячейка
Вид на экране:

Таблицы
Ширина таблицы задается атрибутом WIDTH. Значение можно задавать как в абсолютных единицах (WIDTH=250), так и в относительных (WIDTH="80%").
HTML-код:
Ширина 200 пикселей
Ширина 60%
Вид на экране:

Таблицы
При помощи атрибутов COLSPAN, ROWSPAN можно объединять несколько соседних ячеек столбца или строки в одну большую ячейку.
Атрибут COLSPAN тэгов

Таблицы
HTML-код:
1111
22222
33333
44444
55555
66666
77777
88888
99999
Вид на экране:

Урок 7
Выполните задание № 7