Что такое findslide.org?

FindSlide.org - это сайт презентаций, докладов, шаблонов в формате PowerPoint.


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

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

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

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

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

Содержание

HTML язык гипертекстовой разметки документовСредства создания Web-страниц и Web-сайтовЯзык гипертекстовой разметки документов (HTML)Специализированные HTML-редакторы (Homesite, Hotdog Professional, Coffee Cup HTML Editor ++)Средства визуального проектирования пакета MS OfficeРедакторы визуального проектирования (MS Front Page,
HTML – язык гипертекстовой     разметки HTML язык гипертекстовой разметки документовСредства создания   Web-страниц и Web-сайтовЯзык гипертекстовой HTML язык гипертекстовой разметки документовМетоды конструирования веб-сайтовВизуальный HTML язык гипертекстовой разметки документовВизуальный метод – МЕТОД, КОТОРЫЙ ПОЗВОЛЯЕТ ПОСТРОИТЬ ВЕБ-САЙТ Создание HTML- документа  Есть два основных способа создания HTML-документов.Первый- написание кода Создание HTML- документаДругой способ- «визуальное» составление страниц в специальном HTML-редактореСоставлять HTML-документы можно, HTML язык гипертекстовой разметки документовиз истории:В 1989 году в Женеве в Европейской HTML язык гипертекстовой разметки документов    Позже появилась необходимость в Основные понятия HTML Основные понятия HTMLТеги   Парные теги образуются двумя тегами, открывающим и Основные понятия HTML  Парные теги еще называют «контейнером», а код находящийся Основные понятия HTML  В HTML-документе мета-теги содержат информацию для браузера и Основные понятия HTML Основные понятия HTML Структура HTML-документаС помощью тегов описывается структура документа, его внешний вид и ссылки Структура HTML-документаВесь документ HTML заключается в один большой контейнер . Эта пара Структура HTML-документаЭто моя первая Web-страница Это моя первая Web- страница Наберите текст Оформление HTML- документавнешний вид веб-страницыТег определяет внешний вид веб-страницы, в то время Оформление HTML- документаПример: или Здесь задан синий цвет страницы двумя способами. Оформление HTML- документаВнешний вид веб-страницы- заголовок  При формировании веб-страниц указывается уровни Практическое заданиеОпишите оформление HTML-документ, вставив комментарии      Впервые Оформление HTML- документаФорматирование текста на языке HTMLДля создания нового абзаца используется тег Оформление HTML- документа  Форматирование текста на языке HTML Оформление HTML- документа    Форматирование текста на языке HTMLЗа начертание Оформление HTML- документаВставка изображенийДля хранения изображений используются различные форматы:gif, jpg, png, wmf, Оформление HTML- документа Практическое задание 1Вставь файл с изображением собакиВставка файла с изображением: Вставка файла Практическое задание 2Расположи разными способами изображение ангорской кошки относительно текста, содержащего сведения о ней. Практическое задание 3Размести на веб- странице изображение петуха, обрамляя это изображение рамкой различной ширины Оформление HTML- документа Оформление HTML- документа Практическая работаПостройте таблицу из двух строк и столбцов с фиксированной шириной 250 Оформление HTML- документа Оформление HTML- документа Оформление HTML- документаДля ссылки на e-mail нужно в качестве URL’a написать: mailto:адрес Оформление HTML- документа        Создание гиперссылок
Слайды презентации

Слайд 2 HTML язык гипертекстовой разметки документов
Средства создания Web-страниц

HTML язык гипертекстовой разметки документовСредства создания  Web-страниц и Web-сайтовЯзык гипертекстовой


и Web-сайтов
Язык гипертекстовой разметки документов (HTML)
Специализированные HTML-редакторы (Homesite, Hotdog

Professional, Coffee Cup HTML Editor ++)
Средства визуального проектирования пакета MS Office
Редакторы визуального проектирования
(MS Front Page, Macromedia Dreamweaver )
Одним из самых популярных визуальных HTML- редакторов является программа Microsoft FrontPage 2003. С данной программой мы познакомимся на следующих уроках информатики.


Слайд 3 HTML язык гипертекстовой разметки документов
Методы конструирования веб-сайтов
Визуальный

HTML язык гипертекстовой разметки документовМетоды конструирования веб-сайтовВизуальный





Ручной или программируемый


Слайд 4 HTML язык гипертекстовой разметки документов
Визуальный метод – МЕТОД, КОТОРЫЙ

HTML язык гипертекстовой разметки документовВизуальный метод – МЕТОД, КОТОРЫЙ ПОЗВОЛЯЕТ ПОСТРОИТЬ

ПОЗВОЛЯЕТ ПОСТРОИТЬ ВЕБ-САЙТ С ВЫСОКОЙ СТЕПЕНЬЮ АВТОМАТИЗАЦИИ.
( Редакторы: Microsoft

FrontPage, Dream Weawer (Macromedia), Namo WebEditor? Adobe Golive и др.)

Программируемый метод – метод создания сайта на языке HTML.


Слайд 5 Создание HTML- документа
Есть два основных способа

Создание HTML- документа Есть два основных способа создания HTML-документов.Первый- написание кода

создания HTML-документов.
Первый- написание кода HTML вручную. Для этого нужно

знать все основные теги HTML, хорошо представлять их действие и представлять, как будет выглядеть итоговый результат после того или иного изменения кода.
Достоинства: позволяет контролировать все тонкости HTML-кода, писать код HTML можно в любом текстовом редакторе, например в Блокноте Windows, хотя и существуют различные программы, облегчающие «ручное» кодирование HTML.
Недостатки:
Процесс трудоемкий и требует постоянно держать в памяти массу информации.

Слайд 6 Создание HTML- документа
Другой способ- «визуальное» составление страниц в

Создание HTML- документаДругой способ- «визуальное» составление страниц в специальном HTML-редактореСоставлять HTML-документы

специальном HTML-редакторе
Составлять HTML-документы можно, просто вставляя на страницу нужные

элементы оформления, ссылки на другие документы, изображения, тексты и размещая их так, как необходимо. Такой способ работы называют WYSISWYG (What You See is What You Get-что вы видите, то и получаете)
Достоинства: методика проста в освоении, позволяет быстро создавать достаточно сложные гипертекстовые документы и, кроме того, наглядна.
Недостатки:
HTML- редактор не позволяет реализовать все тонкости языка HTML. Поэтому визуальные HTML-редакторы предусматривают и работу непосредственно с кодом страницы.


Слайд 7 HTML язык гипертекстовой разметки документов
из истории:
В 1989 году в

HTML язык гипертекстовой разметки документовиз истории:В 1989 году в Женеве в

Женеве в Европейской лаборатории физики элементарных частиц Тимам Бернерсом-Ли

и его коллегами была создана концепция распределенной информационной системы на основе гипертекста. Цель создания этой системой было упрощение обмена информации между различными группами физиков.


Слайд 8 HTML язык гипертекстовой разметки документов

Позже

HTML язык гипертекстовой разметки документов  Позже появилась необходимость в создании

появилась необходимость в создании такой системы, которая могла бы

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



Слайд 9 Основные понятия HTML

Основные понятия HTML

Теги
Основой языка HTML являются теги, специальные команды, заключенные в угловые скобки, например ,
, . Между ними находятся коды, которые распознает браузер.
Теги бывают одиночными и парными.
Одиночные теги, как и следует из названия, используются поодиночке, обозначая самостоятельный элемент оформления. Например, тег
означает разрыв строки, а с помощью тега в HTML- документ можно вставить изображение. Теги можно записывать как прописными буквами, так и строчными
(, <title>)<br><br><br><br><br><br> </div> <hr> </div> <div class="descrip"> <h3 id="slide10"> <a href="/img/tmb/14/1325513/8c4f718dd9d9e65e6ee333307b648350-720x.jpg" target="_blank">Слайд 10</a> Основные понятия HTML<br>Теги<br> Парные теги образуются </h3> <div class="image"> <a href="/img/tmb/14/1325513/8c4f718dd9d9e65e6ee333307b648350-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Основные понятия HTMLТеги Парные теги образуются двумя тегами, открывающим и закрывающим, которые отличаются друг от друга только значком «/» перед закрывающим тегом. Парные теги влияют на оформление всего кода HTML, находящегося между ними. "><img src="/img/tmb/14/1325513/8c4f718dd9d9e65e6ee333307b648350-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Основные понятия HTMLТеги Парные теги образуются двумя тегами, открывающим и"></a> </div> <div class="text"> <h4>двумя тегами, открывающим и закрывающим, которые отличаются друг от</h4> друга только значком «/» перед закрывающим тегом. Парные теги влияют на оформление всего кода HTML, находящегося между ними. <br> <br> </div> <hr> </div> <div class="descrip"> <h3 id="slide11"> <a href="/img/tmb/14/1325513/4461446b40797a157097abf96b708bff-720x.jpg" target="_blank">Слайд 11</a> Основные понятия HTML<br> Парные теги еще называют </h3> <div class="image"> <a href="/img/tmb/14/1325513/4461446b40797a157097abf96b708bff-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Основные понятия HTML Парные теги еще называют «контейнером», а код находящийся между ними «содержимом контейнера». Например, Этот текст будет полужирным. Весь текст, помещенный в контейнер оформляется полужирным шрифтом и в Web– браузере будет выглядеть примерно так: «Этот текст будет полужирным».Контейнеры могут вкладываться друг в друга, действуя вместе на содержимое вложенного контейнера. Например, Этот текст будет полужирным А этот текст еще и курсивным. Как будет выглядеть текст в Web– браузере? "><img src="/img/tmb/14/1325513/4461446b40797a157097abf96b708bff-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Основные понятия HTML Парные теги еще называют «контейнером», а код находящийся"></a> </div> <div class="text"> <h4>«контейнером», а код находящийся между ними «содержимом контейнера». Например,</h4> <B> Этот текст будет полужирным</B>. Весь текст, помещенный в контейнер <B> </B> оформляется полужирным шрифтом и в Web– браузере будет выглядеть примерно так: «Этот текст будет полужирным».Контейнеры могут вкладываться друг в друга, действуя вместе на содержимое вложенного контейнера. Например, <B>Этот текст будет полужирным <I> А этот текст еще и курсивным</I></B>. Как будет выглядеть текст в Web– браузере? <br><br> </div> <hr> </div> <div class="descrip"> <h3 id="slide12"> <a href="/img/tmb/14/1325513/8fd5c3a3688a0f51684078cde958e725-720x.jpg" target="_blank">Слайд 12</a> Основные понятия HTML<br> В HTML-документе мета-теги содержат </h3> <div class="image"> <a href="/img/tmb/14/1325513/8fd5c3a3688a0f51684078cde958e725-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Основные понятия HTML В HTML-документе мета-теги содержат информацию для браузера и поисковых систем и всегда размещаются между тегами . Большинство мета-тегов являются необязательными."><img src="/img/tmb/14/1325513/8fd5c3a3688a0f51684078cde958e725-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Основные понятия HTML В HTML-документе мета-теги содержат информацию для браузера и"></a> </div> <div class="text"> <h4>информацию для браузера и поисковых систем и всегда размещаются</h4> между тегами <head> </head>. Большинство мета-тегов являются необязательными.<br> </div> <hr> </div> <div class="descrip"> <h3 id="slide13"> <a href="/img/tmb/14/1325513/164f58d12820dc8bed4f9087971cc5a2-720x.jpg" target="_blank">Слайд 13</a> Основные понятия HTML<br> </h3> <div class="image"> <a href="/img/tmb/14/1325513/164f58d12820dc8bed4f9087971cc5a2-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Основные понятия HTML Теги Примеры самых полезных мета тегов: - при указании этого мета-тега браузер будет правильно отображать текст страницы: .. Этот мета- тег указывает имя автора сайта. . При использовании этого мета-тега определяется дата создания сайта. "><img src="/img/tmb/14/1325513/164f58d12820dc8bed4f9087971cc5a2-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Основные понятия HTML Теги"></a> </div> <div class="text"> <h4> </h4> Теги <br>Примеры самых полезных мета тегов:<br><meta http-eguiv=“conten-type”content=“text/html;charset=кодировка”> - при указании этого мета-тега браузер будет правильно отображать текст страницы: <meta http-eguiv=“conten-type”content=“text/html;charset=Windows-1251>.<br><meta name=“author” content=“имя автора”>. Этот мета- тег указывает имя автора сайта. <meta name=“author” content=“Алесь Симончик”> <br><meta name=“data” content=“месяц, число, год и время через пробел”>. При использовании этого мета-тега определяется дата создания сайта. <meta name=“data” content=“October 27 1998 16:01 Am”><br> </div> <hr> </div> <div class="descrip"> <h3 id="slide14"> <a href="/img/tmb/14/1325513/162c1746ec60fd8d950c35d2e9f55e2c-720x.jpg" target="_blank">Слайд 14</a> Основные понятия HTML<br> </h3> <div class="image"> <a href="/img/tmb/14/1325513/162c1746ec60fd8d950c35d2e9f55e2c-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Основные понятия HTML АтрибутыДополнительные параметры действия тегов задаются атрибутами. Атрибуты записываются вместе с названием тега в угловых скобках. Например, так:.Атрибут SRC указывает адрес изображения, которое будет вставлено в документ Html на место тега IMG.Правило записи атрибутов в теге следующее:"><img src="/img/tmb/14/1325513/162c1746ec60fd8d950c35d2e9f55e2c-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Основные понятия HTML АтрибутыДополнительные параметры"></a> </div> <div class="text"> <h4> Атрибуты<br>Дополнительные параметры</h4> действия тегов задаются атрибутами. Атрибуты записываются вместе с названием тега в угловых скобках. Например, так:<br><IMG SRC=«с:\мои документы\image.jpg»>.Атрибут SRC указывает адрес изображения, которое будет вставлено в документ Html на место тега IMG.<br>Правило записи атрибутов в теге следующее:<br><тег атрибут1=значение атрибут2=значение…><br><br><br> </div> <hr> </div> <div class="descrip"> <h3 id="slide15"> <a href="/img/tmb/14/1325513/6e691bfe9408cc745b0c1c3accaec6c9-720x.jpg" target="_blank">Слайд 15</a> Структура HTML-документа<br>С помощью тегов описывается структура документа, его </h3> <div class="image"> <a href="/img/tmb/14/1325513/6e691bfe9408cc745b0c1c3accaec6c9-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Структура HTML-документаС помощью тегов описывается структура документа, его внешний вид и ссылки на другие документы. В языке HTML есть несколько основных тегов, которые отвечают за его структуру. Это теги , , . "><img src="/img/tmb/14/1325513/6e691bfe9408cc745b0c1c3accaec6c9-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Структура HTML-документаС помощью тегов описывается структура документа, его внешний вид и"></a> </div> <div class="text"> <h4>внешний вид и ссылки на другие документы. В языке</h4> HTML есть несколько основных тегов, которые отвечают за его структуру. Это теги <html>, <head>, <body>. <br><br> </div> <hr> </div> <div class="descrip"> <h3 id="slide16"> <a href="/img/tmb/14/1325513/06681be63ad02d18224e3d9a7862dd19-720x.jpg" target="_blank">Слайд 16</a> Структура HTML-документа<br>Весь документ HTML заключается в один большой </h3> <div class="image"> <a href="/img/tmb/14/1325513/06681be63ad02d18224e3d9a7862dd19-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Структура HTML-документаВесь документ HTML заключается в один большой контейнер . Эта пара тегов сообщает Web- браузеру о том, что документ написан на языке HTML. Контейнер содержит еще два контейнера. Первый , называется заголовком, и в нем содержится разнообразная информация о содержимом всего документа: язык, на котором написаны тексты, версия языка HTML, на которую ориентировалось создатели документа, основные ключевые слова для поисковых «ботов», общий заголовок HTML- документа и прочее. Второй контейнер включает в себя все основное содержимое документа, его «тело».В HTML-документе можно разместить комментарии, которые браузером не отображаются:< !Комментарии>. "><img src="/img/tmb/14/1325513/06681be63ad02d18224e3d9a7862dd19-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Структура HTML-документаВесь документ HTML заключается в один большой контейнер . Эта"></a> </div> <div class="text"> <h4>контейнер . Эта пара тегов сообщает Web- браузеру</h4> о том, что документ написан на языке HTML. Контейнер содержит еще два контейнера. Первый <head> </head>, называется заголовком, и в нем содержится разнообразная информация о содержимом всего документа: язык, на котором написаны тексты, версия языка HTML, на которую ориентировалось создатели документа, основные ключевые слова для поисковых «ботов», общий заголовок HTML- документа и прочее. Второй контейнер <body> </body> включает в себя все основное содержимое документа, его «тело».<br>В HTML-документе можно разместить комментарии, которые браузером не отображаются:< !Комментарии>.<br><br> <br> </div> <hr> </div> <div class="descrip"> <h3 id="slide17"> <a href="/img/tmb/14/1325513/4d393f78e779ac3dfc11378f1750fd1f-720x.jpg" target="_blank">Слайд 17</a> Структура HTML-документа<br><br><br><br><br>Это моя первая </h3> <div class="image"> <a href="/img/tmb/14/1325513/4d393f78e779ac3dfc11378f1750fd1f-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Структура HTML-документаЭто моя первая Web-страница Это моя первая Web- страница Наберите текст в Блокноте и просмотрите в Web- браузере. "><img src="/img/tmb/14/1325513/4d393f78e779ac3dfc11378f1750fd1f-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Структура HTML-документаЭто моя первая Web-страница Это моя первая Web- страница Наберите"></a> </div> <div class="text"> <h4>Web-страница<br><br><br> Это моя первая Web- <br>страница</h4> </span></p><br></body><br></html><br>Наберите текст в Блокноте и просмотрите в Web- браузере. <br><br><br><br><br> </div> <hr> </div> <div class="descrip"> <h3 id="slide18"> <a href="/img/tmb/14/1325513/a7cb3db2a5b52af7d2cb8332df4b26f4-720x.jpg" target="_blank">Слайд 18</a> Оформление HTML- документа<br>внешний вид веб-страницы<br>Тег определяет внешний </h3> <div class="image"> <a href="/img/tmb/14/1325513/a7cb3db2a5b52af7d2cb8332df4b26f4-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Оформление HTML- документавнешний вид веб-страницыТег определяет внешний вид веб-страницы, в то время как отдельные ее элементы, например заголовки, таблицы могут иметь свое особенное оформлениеВыбор цвета страницы, фонового рисунка и цвета текста на ней является весьма важным, так как от этого зависит визуальное восприятие всего сайтаЦвет страницы задается атрибутом bgcolor, а цвет текста- text.Значением атрибутов является цвет, который задается своим названием на английском языке или его шестнадцатеричным кодом. "><img src="/img/tmb/14/1325513/a7cb3db2a5b52af7d2cb8332df4b26f4-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Оформление HTML- документавнешний вид веб-страницыТег определяет внешний вид веб-страницы, в то"></a> </div> <div class="text"> <h4>вид веб-страницы, в то время как отдельные ее элементы,</h4> например заголовки, таблицы могут иметь свое особенное оформление<br>Выбор цвета страницы, фонового рисунка и цвета текста на ней является весьма важным, так как от этого зависит визуальное восприятие всего сайта<br>Цвет страницы задается атрибутом bgcolor, а цвет текста- text.Значением атрибутов является цвет, который задается своим названием на английском языке или его шестнадцатеричным кодом. <br><br> </div> <hr> </div> <div class="descrip"> <h3 id="slide19"> <a href="/img/tmb/14/1325513/ab2adacd0046641459fdc7cd4c38b68a-720x.jpg" target="_blank">Слайд 19</a> Оформление HTML- документа<br>Пример:<br> или <br> </h3> <div class="image"> <a href="/img/tmb/14/1325513/ab2adacd0046641459fdc7cd4c38b68a-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Оформление HTML- документаПример: или Здесь задан синий цвет страницы двумя способами."><img src="/img/tmb/14/1325513/ab2adacd0046641459fdc7cd4c38b68a-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Оформление HTML- документаПример: или Здесь задан синий цвет страницы двумя способами."></a> </div> <div class="text"> <h4>шестнадцатеричный цвет фона><br>Здесь задан синий цвет страницы двумя способами.<br></h4> </div> <hr> </div> <div class="descrip"> <h3 id="slide20"> <a href="/img/tmb/14/1325513/93ffae26d3c9632214ad6cdedf3c1cb3-720x.jpg" target="_blank">Слайд 20</a> Оформление HTML- документа<br>Внешний вид веб-страницы- заголовок<br> При </h3> <div class="image"> <a href="/img/tmb/14/1325513/93ffae26d3c9632214ad6cdedf3c1cb3-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Оформление HTML- документаВнешний вид веб-страницы- заголовок При формировании веб-страниц указывается уровни заголовков, которые обозначаются h1,h2,…h6. Для описания уровней используются теги ,,…. Заголовок уровня 1 самый крупный, а уровня 6- самый маленький. Для выравнивания текста на странице обычно указывается одно из трех значений атрибута align: align=center-выравнивание заголовка по центру align=left-выравнивание заголовка по левому краю align=right -выравнивание заголовка по правому краю "><img src="/img/tmb/14/1325513/93ffae26d3c9632214ad6cdedf3c1cb3-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Оформление HTML- документаВнешний вид веб-страницы- заголовок При формировании веб-страниц указывается уровни"></a> </div> <div class="text"> <h4>формировании веб-страниц указывается уровни заголовков, которые обозначаются h1,h2,…h6. Для</h4> описания уровней используются теги <h1>,<h2>,…<h6>. Заголовок уровня 1 самый крупный, а уровня 6- самый маленький. Для выравнивания текста на странице обычно указывается одно из трех значений атрибута align: align=center-выравнивание заголовка по центру <br> align=left-выравнивание заголовка по левому краю <br> align=right -выравнивание заголовка по правому краю <br> </div> <hr> </div> <div class="descrip"> <h3 id="slide21"> <a href="/img/tmb/14/1325513/07b5be6e37ed173e3063411b6c5fc446-720x.jpg" target="_blank">Слайд 21</a> Практическое задание<br>Опишите оформление HTML-документ, вставив комментарии <br><br><br><br> </h3> <div class="image"> <a href="/img/tmb/14/1325513/07b5be6e37ed173e3063411b6c5fc446-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Практическое заданиеОпишите оформление HTML-документ, вставив комментарии Впервые создаем HTML-документPS:в сети Интернет существуют сайты, содержащие готовые фоновые рисунки (обои), например сайт «Азбука дизайнера»- http:www.dsgn.al.ru/fons.htm .Эти фоновые рисунки можно использовать для создания веб-страниц. Также в качестве фонового рисунка можно использовать графический файл- , где *.*- имя графического файла с расширением *.jpg, *. gif, *.png."><img src="/img/tmb/14/1325513/07b5be6e37ed173e3063411b6c5fc446-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Практическое заданиеОпишите оформление HTML-документ, вставив комментарии Впервые создаем"></a> </div> <div class="text"> <h4> Впервые создаем HTML-документ<br><br><br><br></h4> align=center><br><h2 align=left><br><h3 align=right><br></body><br></html><br>PS:в сети Интернет существуют сайты, содержащие готовые фоновые рисунки (обои), например сайт «Азбука дизайнера»- http:www.dsgn.al.ru/fons.htm .Эти фоновые рисунки можно использовать для создания веб-страниц. Также в качестве фонового рисунка можно использовать графический файл- <body backgroud=“*.*”>, где *.*- имя графического файла с расширением *.jpg, *. gif, *.png.<br><br><br><br> </div> <hr> </div> <div class="descrip"> <h3 id="slide22"> <a href="/img/tmb/14/1325513/e25f260a312ce3edc52b58c0e972a08c-720x.jpg" target="_blank">Слайд 22</a> Оформление HTML- документа<br>Форматирование текста на языке HTML<br>Для создания </h3> <div class="image"> <a href="/img/tmb/14/1325513/e25f260a312ce3edc52b58c0e972a08c-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Оформление HTML- документаФорматирование текста на языке HTMLДля создания нового абзаца используется тег а для перехода на новую строчку без создания абзаца- тег .Эти теги закрывать не обязательно, если в них не используются атрибуты. Выравнивание абзацев происходит аналогично выравниванию заголовков при помощи атрибута align. Для определения типа, размера и цвета символа используется тег . Свойства символа определяются с помощью атрибутов; faсe=«название шрифта»сolor=«цвет символа»size=размер шрифта ( по умолчанию размер равен 3)Поместив текст между тегами , где n-цифровое значение, можно придать ему нужный размер(1-6)."><img src="/img/tmb/14/1325513/e25f260a312ce3edc52b58c0e972a08c-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Оформление HTML- документаФорматирование текста на языке HTMLДля создания нового абзаца используется"></a> </div> <div class="text"> <h4>нового абзаца используется тег а для перехода на</h4> новую строчку без создания абзаца- тег <br>.<br>Эти теги закрывать не обязательно, если в них не используются атрибуты. Выравнивание абзацев происходит аналогично выравниванию заголовков при помощи атрибута align. Для определения типа, размера и цвета символа используется тег <font> </font>. Свойства символа определяются с помощью атрибутов; <br>faсe=«название шрифта»<br>сolor=«цвет символа»<br>size=размер шрифта ( по умолчанию размер равен 3)<br>Поместив текст между тегами <font size=n>, где n-цифровое значение, можно придать ему нужный размер(1-6).<br><br><br><br> </div> <hr> </div> <div class="descrip"> <h3 id="slide23"> <a href="/img/tmb/14/1325513/5285150907b04947488a6c692f5b59f1-720x.jpg" target="_blank">Слайд 23</a> Оформление HTML- документа<br> Форматирование текста на языке </h3> <div class="image"> <a href="/img/tmb/14/1325513/5285150907b04947488a6c692f5b59f1-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Оформление HTML- документа Форматирование текста на языке HTML Выведем текст с использованием тега Шрифт Arial красного цвета вдруг стал большим < font size=-3>Внезапно текст уменьшился Текст превратился а Tahoma зеленого цвета Попробуйте объяснить значение тегов: , < font size=-3>."><img src="/img/tmb/14/1325513/5285150907b04947488a6c692f5b59f1-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Оформление HTML- документа Форматирование текста на языке HTML Выведем текст"></a> </div> <div class="text"> <h4>HTML<br> Выведем текст с использованием тега</h4> <font><br><p><font face=“Arial” color=red>Шрифт Arial красного цвета <br><font size=+3>вдруг стал большим </font><br><p>< font size=-3>Внезапно текст уменьшился </font><br><p><font fase=“Tahoma” color=green> Текст превратился а Tahoma зеленого цвета </font><br><br>Попробуйте объяснить значение тегов: <font face=“Arial” color=red>,<br> < font size=-3>.<br> </div> <hr> </div> <div class="descrip"> <h3 id="slide24"> <a href="/img/tmb/14/1325513/ec2ab076649ec833d2698c50df68313e-720x.jpg" target="_blank">Слайд 24</a> Оформление HTML- документа<br> Форматирование текста </h3> <div class="image"> <a href="/img/tmb/14/1325513/ec2ab076649ec833d2698c50df68313e-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Оформление HTML- документа Форматирование текста на языке HTMLЗа начертание текста отвечает целая группа тегов, значение которых приведены в таблице"><img src="/img/tmb/14/1325513/ec2ab076649ec833d2698c50df68313e-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Оформление HTML- документа Форматирование текста на языке HTMLЗа начертание текста"></a> </div> <div class="text"> <h4>на языке HTML<br>За начертание текста отвечает целая группа тегов,</h4> значение которых приведены в таблице<br><br> </div> <hr> </div> <div class="descrip"> <h3 id="slide25"> <a href="/img/tmb/14/1325513/b3689fbd359ced6e9ebeed09372c55fc-720x.jpg" target="_blank">Слайд 25</a> Оформление HTML- документа<br>Вставка изображений<br>Для хранения изображений используются различные </h3> <div class="image"> <a href="/img/tmb/14/1325513/b3689fbd359ced6e9ebeed09372c55fc-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Оформление HTML- документаВставка изображенийДля хранения изображений используются различные форматы:gif, jpg, png, wmf, bmp и др. Наиболее предпочтительны для изображения графические форматы gif, jpeg, png, которые позволяют ускорить процесс загрузки.Для вставки изображения используется тег следующей конструкции:< img src=«Имя файла» border=«Ширина рамки» align=«Выравнивание»> width=«Ширина» height=«Высота» hspace=«Отступ по горизонтали» vspase=«Отступ по вертикали» title=«Подсказка»> "><img src="/img/tmb/14/1325513/b3689fbd359ced6e9ebeed09372c55fc-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Оформление HTML- документаВставка изображенийДля хранения изображений используются различные форматы:gif, jpg, png,"></a> </div> <div class="text"> <h4>форматы:gif, jpg, png, wmf, bmp и др. Наиболее предпочтительны</h4> для изображения графические форматы gif, jpeg, png, которые позволяют ускорить процесс загрузки.<br><br><br>Для вставки изображения используется тег <img> следующей конструкции:<br>< img src=«Имя файла» border=«Ширина рамки» align=«Выравнивание»> width=«Ширина» height=«Высота» hspace=«Отступ по горизонтали» vspase=«Отступ по вертикали» title=«Подсказка»> <br> </div> <hr> </div> <div class="descrip"> <h3 id="slide26"> <a href="/img/tmb/14/1325513/4f35ebb1e5b0a991121aa14b94b302c2-720x.jpg" target="_blank">Слайд 26</a> Оформление HTML- документа<br> </h3> <div class="image"> <a href="/img/tmb/14/1325513/4f35ebb1e5b0a991121aa14b94b302c2-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Оформление HTML- документа Назначение основных атрибутов тега Align Выравнивание текста по: top — верхнему краю изображения; middle — средней части изображения; bottom — нижнему краю изображения; left — показывает изображение слева; right — показывает изображение в правой части окна.Height Указывает высоту изображения в пикселах или процентах Width Указывает ширину изображения в пикселах или процентахborderПрисваивает значение ширины рамки в пикселах вокруг изображенияVspace Расширяет свободное пространство в пикселах во­круг изображения по вертикалиHspace Расширяет свободное пространство в пикселах вокруг изображения по горизонтали Title Отображает подсказку по вставленному изображению при установке указателя мыши"><img src="/img/tmb/14/1325513/4f35ebb1e5b0a991121aa14b94b302c2-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Оформление HTML- документа"></a> </div> <div class="text"> <h4><br> </h4> Назначение основных атрибутов тега <img><br>Align Выравнивание текста по:<br> top — верхнему краю изображения;<br> middle — средней части изображения;<br> bottom — нижнему краю изображения;<br> left — показывает изображение слева;<br> right — показывает изображение в правой части окна.<br>Height Указывает высоту изображения в пикселах или<br> процентах <br>Width Указывает ширину изображения в пикселах или<br> процентахborderПрисваивает значение ширины рамки в пикселах вокруг<br> изображения<br>Vspace Расширяет свободное пространство в пикселах во­круг изображения по <br> вертикали<br>Hspace Расширяет свободное пространство в пикселах вокруг изображения по<br> горизонтали <br>Title Отображает подсказку по вставленному изображению при установке указателя мыши<br> </div> <hr> </div> <div class="descrip"> <h3 id="slide27"> <a href="/img/tmb/14/1325513/e22426a5f36894996f45cbd5d80d6ddd-720x.jpg" target="_blank">Слайд 27</a> Практическое задание 1<br>Вставь файл с изображением собаки<br>Вставка файла </h3> <div class="image"> <a href="/img/tmb/14/1325513/e22426a5f36894996f45cbd5d80d6ddd-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Практическое задание 1Вставь файл с изображением собакиВставка файла с изображением: Вставка файла с указанием ширины и высоты изображения:"><img src="/img/tmb/14/1325513/e22426a5f36894996f45cbd5d80d6ddd-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Практическое задание 1Вставь файл с изображением собакиВставка файла с изображением: Вставка"></a> </div> <div class="text"> <h4>с изображением:<br> <br>Вставка файла с указанием ширины и</h4> высоты изображения:<br><img src="/pes.gif" width="100" height="93"><br> </div> <hr> </div> <div class="descrip"> <h3 id="slide28"> <a href="/img/tmb/14/1325513/591a44bc9d99f96fdbfd8d7f2c06f12a-720x.jpg" target="_blank">Слайд 28</a> Практическое задание 2<br>Расположи разными способами изображение ангорской кошки </h3> <div class="image"> <a href="/img/tmb/14/1325513/591a44bc9d99f96fdbfd8d7f2c06f12a-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Практическое задание 2Расположи разными способами изображение ангорской кошки относительно текста, содержащего сведения о ней."><img src="/img/tmb/14/1325513/591a44bc9d99f96fdbfd8d7f2c06f12a-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Практическое задание 2Расположи разными способами изображение ангорской кошки относительно текста, содержащего сведения о ней."></a> </div> <div class="text"> <h4>относительно текста, содержащего сведения о ней.<br></h4> </div> <hr> </div> <div class="descrip"> <h3 id="slide29"> <a href="/img/tmb/14/1325513/2bff13e17b356f2ea1203bc7fcd37319-720x.jpg" target="_blank">Слайд 29</a> Практическое задание 3<br>Размести на веб- странице изображение петуха, </h3> <div class="image"> <a href="/img/tmb/14/1325513/2bff13e17b356f2ea1203bc7fcd37319-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Практическое задание 3Размести на веб- странице изображение петуха, обрамляя это изображение рамкой различной ширины"><img src="/img/tmb/14/1325513/2bff13e17b356f2ea1203bc7fcd37319-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Практическое задание 3Размести на веб- странице изображение петуха, обрамляя это изображение рамкой различной ширины"></a> </div> <div class="text"> <h4>обрамляя это изображение рамкой различной ширины<br><br></h4> </div> <hr> </div> <div class="descrip"> <h3 id="slide30"> <a href="/img/tmb/14/1325513/ae533e004a8c4c70a24b559ce5ad5e39-720x.jpg" target="_blank">Слайд 30</a> Оформление HTML- документа<br> </h3> <div class="image"> <a href="/img/tmb/14/1325513/ae533e004a8c4c70a24b559ce5ad5e39-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Оформление HTML- документа Создание таблиц При построении таблицы используются следующие основные теги:а) основной элемент описания таблицы — тег < table > < /table >;б) определение строк в таблице — тег ;в) описание ячеек в таблице — теги .Тег использует целый ряд дополнительных атрибутов: align, width, border, bordercolor, cellspacing и др. В дальнейшем рассмотрим назначения еще незнакомых вам атрибутов."><img src="/img/tmb/14/1325513/ae533e004a8c4c70a24b559ce5ad5e39-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Оформление HTML- документа Создание таблиц При"></a> </div> <div class="text"> <h4> Создание таблиц <br>При</h4> построении таблицы используются следующие основные теги:<br>а) основной элемент описания таблицы — тег < table > < /table >;<br>б) определение строк в таблице — тег <tr>;<br>в) описание ячеек в таблице — теги <td>.<br>Тег <tаblе> </table> использует целый ряд дополнительных атрибутов: align, width, border, bordercolor, cellspacing и др. В дальнейшем рассмотрим назначения еще незнакомых вам атрибутов.<br> </div> <hr> </div> <div class="descrip"> <h3 id="slide31"> <a href="/img/tmb/14/1325513/4c3987d9b468ad19574c8118c0d7858a-720x.jpg" target="_blank">Слайд 31</a> Оформление HTML- документа<br> </h3> <div class="image"> <a href="/img/tmb/14/1325513/4c3987d9b468ad19574c8118c0d7858a-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Оформление HTML- документа Создание таблицШирина таблицы может быть задана в пикселах или в процентном отношении к ширине страницы, например, width = 450 или width = 40%.При построении таблицы создается «впечатление» их выпуклости с помощью двух рамок— фронтальной и боковой (рис.Ширину боковой рамки в пикселах определяет атрибут border = ширина боковой рамки, а ширину фронтальной рамки определяет атрибут cellspacing = ширина фронтальной рамки, bordercolor= цвет границы таблицы.Боковая рамка Фронтальная рамка"><img src="/img/tmb/14/1325513/4c3987d9b468ad19574c8118c0d7858a-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Оформление HTML- документа Создание таблицШирина таблицы"></a> </div> <div class="text"> <h4> Создание таблиц<br>Ширина таблицы может</h4> быть задана в пикселах или в процентном отношении к ширине страницы, например, width = 450 или width = 40%.<br>При построении таблицы создается «впечатление» их выпуклости с помощью двух рамок— фронтальной и боковой (рис.<br><br><br><br><br><br><br><br>Ширину боковой рамки в пикселах определяет атрибут border = ширина боковой рамки, а ширину фронтальной рамки определяет атрибут cellspacing = ширина фронтальной рамки, bordercolor= цвет границы таблицы.<br><p>Боковая рамка <br><p>Фронтальная рамка<br> </div> <hr> </div> <div class="descrip"> <h3 id="slide32"> <a href="/img/tmb/14/1325513/74d9aa079d9f74af12e692ac27b963ba-720x.jpg" target="_blank">Слайд 32</a> Практическая работа<br>Постройте таблицу из двух строк и столбцов </h3> <div class="image"> <a href="/img/tmb/14/1325513/74d9aa079d9f74af12e692ac27b963ba-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Практическая работаПостройте таблицу из двух строк и столбцов с фиксированной шириной 250 пикселей, шириной боковой рамки 2 пикселя и ячейками светло-зеленого цвета. Если указать атрибуты border=1, cellspacing=0 и bordercolor=black, то эффект выпуклости границы рамки практически исчезнет и получим обычные границы таблицы черного цвета."><img src="/img/tmb/14/1325513/74d9aa079d9f74af12e692ac27b963ba-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Практическая работаПостройте таблицу из двух строк и столбцов с фиксированной шириной"></a> </div> <div class="text"> <h4>с фиксированной шириной 250 пикселей, шириной боковой рамки 2</h4> пикселя и ячейками светло-зеленого цвета. <br><p>Если указать атрибуты border=1, cellspacing=0 и bordercolor=black, то эффект выпуклости границы рамки практически исчезнет и получим обычные границы таблицы черного цвета.<br> </div> <hr> </div> <div class="descrip"> <h3 id="slide33"> <a href="/img/tmb/14/1325513/b592d5fb471910f5de42f86904db726b-720x.jpg" target="_blank">Слайд 33</a> Оформление HTML- документа<br> </h3> <div class="image"> <a href="/img/tmb/14/1325513/b592d5fb471910f5de42f86904db726b-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Оформление HTML- документа Создание таблицЯчейки в таблице могут быть объединены с помощью атрибутов rowspan = n, где n (n > 1) — количество строк, выделяемых под ячейку или colspan = k, где k (k > 1) — количество столбцов, выделенных под ячейку.При построении таблиц на языке HTML допускается вложение в ячейки других таблиц "><img src="/img/tmb/14/1325513/b592d5fb471910f5de42f86904db726b-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Оформление HTML- документа"></a> </div> <div class="text"> <h4> </h4> Создание таблиц<br>Ячейки в таблице могут быть объединены с помощью атрибутов rowspan = n, где n (n > 1) — количество строк, выделяемых под ячейку или colspan = k, где k (k > 1) — количество столбцов, выделенных под ячейку.<br><br><p>При построении таблиц на языке HTML допускается вложение в ячейки других таблиц <br> </div> <hr> </div> <div class="descrip"> <h3 id="slide34"> <a href="/img/tmb/14/1325513/861eb9a662b68a3aaa8d83f8801a6cc0-720x.jpg" target="_blank">Слайд 34</a> Оформление HTML- документа<br> </h3> <div class="image"> <a href="/img/tmb/14/1325513/861eb9a662b68a3aaa8d83f8801a6cc0-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Оформление HTML- документа Создание гиперссылок За организацию ссылок на языке HTML отвечает тег , который чаще всего использует следующий шаблон: Произвольный текст текст для щелчка по нем мышью < /а >. Атрибут href может указывать на URL - адрес любого ресурса Интернет, который может быть абсолютным, то есть иметь полный адрес странички например, http://academy.edu.by/index.htm) или относительным, например, ../index.htm). Гиперссылкой может быть любое изображение, поддерживаемое браузером. Для этого между тегами ... вместо текста ссылки нужно вставить графический элемент, например: "><img src="/img/tmb/14/1325513/861eb9a662b68a3aaa8d83f8801a6cc0-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Оформление HTML- документа Создание гиперссылок"></a> </div> <div class="text"> <h4> Создание гиперссылок<br></h4> За организацию ссылок на языке HTML отвечает тег <a> </a>, который чаще всего использует следующий шаблон:<br><br> Произвольный текст <a href = "Адрес ссылки"> текст для щелчка по нем мышью < /а >. <br> Атрибут href может указывать на URL - адрес любого ресурса Интернет, который может быть абсолютным, то есть иметь полный адрес странички например, <br> http://academy.edu.by/index.htm) или относительным, например, ../index.htm). <br> Гиперссылкой может быть любое изображение, поддерживаемое браузером. Для этого между тегами <br> <a href >...</a > вместо текста ссылки нужно вставить графический элемент, например: <a href="/d1.htm"> <img src="/face.gif"></a> <br> </div> <hr> </div> <div class="descrip"> <h3 id="slide35"> <a href="/img/tmb/14/1325513/8c8872fb46d266ad1531164e62bdf176-720x.jpg" target="_blank">Слайд 35</a> Оформление HTML- документа<br>Для ссылки на e-mail нужно в </h3> <div class="image"> <a href="/img/tmb/14/1325513/8c8872fb46d266ad1531164e62bdf176-720x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Оформление HTML- документаДля ссылки на e-mail нужно в качестве URL’a написать: mailto:адрес электронной почты, например: Мой адресОрганизация внутренних ссылок, позволяющая осуществлять переход внутри текущей страницы, выполняется в два этапа:а) сначала в нужных местах веб-страницы устанавливается закладка < /а >;б) на втором этапе определяется ссылка на метку по следующему шаблону: Текст подсказки < a href = "#Закладка"> текст для щелчка мышью."><img src="/img/tmb/14/1325513/8c8872fb46d266ad1531164e62bdf176-720x.jpg" title="Htmlязык гипертекстовой разметки документов" alt="Оформление HTML- документаДля ссылки на e-mail нужно в качестве URL’a написать:"></a> </div> <div class="text"> <h4>качестве URL’a написать: mailto:адрес электронной почты, например: <br> </h4> <a href="mailto:lisica@tut.by">Мой адрес</a><br>Организация внутренних ссылок, позволяющая осуществлять переход внутри текущей страницы, выполняется в два этапа:<br>а) сначала в нужных местах веб-страницы устанавливается закладка <br> <a name = "Закладка" > < /а >;<br>б) на втором этапе определяется ссылка на метку по следующему шаблону: Текст подсказки < a href = "#Закладка"> текст для щелчка мышью</а>.<br><br> </div> <hr> </div> </div> <div class="custom" > <!-- Yandex.RTB R-A-2962960-4 --> <div id="yandex_rtb_R-A-2962960-4"></div> <script>window.yaContextCb.push(()=>{ Ya.Context.AdvManager.render({ "blockId": "R-A-2962960-4", "renderTo": "yandex_rtb_R-A-2962960-4" }) }) </script></div> <div class="content dl-content" style="margin-top: 20px"> <form action="" method="post" class="js_captcha dl-form"> <div> <ul> <li>Имя файла: htmlyazyk-gipertekstovoy-razmetki-dokumentov.pptx</li> <li>Количество просмотров: 81</li> <li>Количество скачиваний: 0</li> </ul> <div class="g-recaptcha" data-sitekey="6Lf0iN8nAAAAACKv8U8VhTtj8F1wq0TA-RBjxFb2"></div> <input type="submit" value="Скачать презентацию"> <input type="hidden" name="task" value="dodownload"> <input type="hidden" name="c964487ba0bbb3662bbdc56dcca13d44" value="1" /> </div> <div class="clear"></div> </form> <div class="adBlockDownload"> <div class="banners"></div> </div> </div> <div class="itemNavigation"> <div class="itemNavigation-wrapper"> <div class="itemNavigation-item"> - Предыдущая <a class="itemNavigation-link" href="/geografiya/natsionalnye-simvoly-velikobritanii">Национальные символы Великобритании</a> </div> <div class="itemNavigation-item"> Следующая - <a class="itemNavigation-link" href="/istoriya/pionery-geroi-4_">Пионеры - герои</a> </div> </div> </div> </div> <div class="right"> <div class="banners"> <div class="custom" > <!-- Yandex.RTB R-A-2962960-2 --> <div id="yandex_rtb_R-A-2962960-2"></div> <script>window.yaContextCb.push(()=>{ Ya.Context.AdvManager.render({ "blockId": "R-A-2962960-2", "renderTo": "yandex_rtb_R-A-2962960-2" }) }) </script></div> </div> <div class="list related"> <h2>Похожие презентации</h2> <div class="wrapper"> <a href="/uncategorized/lechenie-genami-fantastika-ili-realnost"> <img src="/img/tmb/14/1377173/aa29d992a56a7bc82847d97ba6f63802-210x.jpg" alt=" Лечение генами - фантастика или реальность?"> <span class="desc"> <span> Лечение генами - фантастика или реальность?</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 89</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/osobennosti-formirovaniya-nravstvenno-patrioticheskih-kachestv-u"> <img src="/img/tmb/8/743510/79882a355cdd4478fa41f7ca5e889cbe-210x.jpg" alt="Особенности формирования нравственно-патриотических качеств у детей дошкольного возраста презентация к уроку по теме"> <span class="desc"> <span>Особенности формирования нравственно-патриотических качеств у детей дошкольного возраста презентация к уроку по теме</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 78</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/roditelskoe-sobranie-v-detskiy-sad-bez"> <img src="/img/tmb/9/875677/3a4fd071ba93ac1cb88d9e1ed9cfd35c-210x.jpg" alt="Родительское собрание в детский сад без слез презентация к уроку по теме"> <span class="desc"> <span>Родительское собрание в детский сад без слез презентация к уроку по теме</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 95</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/master-klass-dlya-vospitateley-traditsionnaya-glinyanaya"> <img src="/img/tmb/8/766820/747553b4544220db26c7eacc0c233eaf-210x.jpg" alt="МАСТЕР-КЛАСС ДЛЯ ВОСПИТАТЕЛЕЙ ТРАДИЦИОННАЯ ГЛИНЯНАЯ ДЕТСКАЯ ИГРУШКА материал"> <span class="desc"> <span>МАСТЕР-КЛАСС ДЛЯ ВОСПИТАТЕЛЕЙ ТРАДИЦИОННАЯ ГЛИНЯНАЯ ДЕТСКАЯ ИГРУШКА материал</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 93</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/amerikaly-a-kbelekhyphantria-cunea-drurymast-zhadyra"> <img src="/img/tmb/14/1331362/57c9ef271c7c7e3d829754c6187caf53-210x.jpg" alt="Америкалық ақ көбелекhyphantria cunea druryМақсұт Жадыра 312"> <span class="desc"> <span>Америкалық ақ көбелекhyphantria cunea druryМақсұт Жадыра 312</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 102</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/prezentatsiya-kruzhka-dopolnitelnogo-obrazovaniya-tsvetnye-ladoshki"> <img src="/img/tmb/8/767770/6d666f408d447e1300ef66a795deac3c-210x.jpg" alt="Презентация кружка дополнительного образования Цветные ладошки. материал (старшая группа)"> <span class="desc"> <span>Презентация кружка дополнительного образования Цветные ладошки. материал (старшая группа)</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 103</span> </span> </a> </div> <div class="clear"></div> </div> </div> </div> <div class="cntWrapper"> <div class="list"> <h2 class="right-heading" id="related">Похожие презентации</h2> <div class="wrapper"> <a href="/uncategorized/formirovanie-predstavleniy-o-znachenii-vody-v"> <img src="/img/tmb/8/782555/c0c69e16527dd44c3758d40967847bfb-210x.jpg" alt="Формирование представлений о значении воды в нашей жизни проект (старшая группа)"> <span class="desc"> <span>Формирование представлений о значении воды в нашей жизни проект (старшая группа)</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 86</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/vvedenie-v-teoriyu-organizatsii"> <img src="/img/tmb/13/1254234/2dce4bde0c4ce58b97b9a147e71fcb92-210x.jpg" alt="ВВЕДЕНИЕ В ТЕОРИЮ ОРГАНИЗАЦИИ"> <span class="desc"> <span>ВВЕДЕНИЕ В ТЕОРИЮ ОРГАНИЗАЦИИ</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 98</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/tehnologiya-izgotovleniya-pechatnyh-plat"> <img src="/img/tmb/15/1436585/f2d7efe05ebffdc283d69b2fe98ce587-210x.jpg" alt="Технология изготовления печатных плат"> <span class="desc"> <span>Технология изготовления печатных плат</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 89</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/567288-prezentatsiya-k-vneklassnomu-meropriyatiyu-mon-ulsko"> <img src="/img/tmb/6/567288/e7e1bee20a4caf1874e84d0632cabdd1-210x.jpg" alt="Презентация к внеклассному мероприятию Мон улӥсько удмурт шаерын"> <span class="desc"> <span>Презентация к внеклассному мероприятию Мон улӥсько удмурт шаерын</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 147</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/podgotovka-k-novomu-godu-prezentatsiya"> <img src="/img/tmb/8/759043/90f6523e9c4ff9bf3b2d4c8f045ed653-210x.jpg" alt="Подготовка к Новому году. презентация"> <span class="desc"> <span>Подготовка к Новому году. презентация</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 166</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/osnovy-izucheniya-skeletirovannyh-ostankov-cheloveka"> <img src="/img/tmb/14/1317561/cb615bd29e8e66882dc082febf5a9898-210x.jpg" alt="Основы изучения скелетированных останков человека"> <span class="desc"> <span>Основы изучения скелетированных останков человека</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 105</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/nalog-na-pribylorganizatsiy"> <img src="/img/tmb/13/1235323/2af2c84bb85d6be76906a6e7f4766be4-210x.jpg" alt="НАЛОГ НА ПРИБЫЛЬОРГАНИЗАЦИЙ"> <span class="desc"> <span>НАЛОГ НА ПРИБЫЛЬОРГАНИЗАЦИЙ</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 135</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/540527-prezentatsiya-po-kompyuternoy-grafike-geometricheskie-postroeniya"> <img src="/img/tmb/6/540527/cf68649c42202246b51b7e8a4a25f306-210x.jpg" alt="Презентация по компьютерной графике геометрические построения"> <span class="desc"> <span>Презентация по компьютерной графике геометрические построения</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 97</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/ekologchn-problemi-teplo-energetiki-ta-teplo"> <img src="/img/tmb/14/1339298/31e31fb7a2a96490dcb4fe68ee86cf94-210x.jpg" alt="Екологічні проблеми тепло енергетики та тепло використання"> <span class="desc"> <span>Екологічні проблеми тепло енергетики та тепло використання</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 89</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/koporativnoe-obuchenie-uchiteley-kak-odna-iz"> <img src="/img/tmb/8/780844/5f6097e273be8b74263d0b2a8dce148f-210x.jpg" alt="Копоративное обучение учителей как одна из форм методической работы. презентация к уроку"> <span class="desc"> <span>Копоративное обучение учителей как одна из форм методической работы. презентация к уроку</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 90</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/biologicheskaya-produktivnost-vzaimootnosheniya-mezhdu-organizmami-v"> <img src="/img/tmb/13/1263389/668e1a96994a223202332f0afda08360-210x.jpg" alt="Биологическая продуктивность, взаимоотношения между организмами в экосистеме. Трофические цепи"> <span class="desc"> <span>Биологическая продуктивность, взаимоотношения между организмами в экосистеме. Трофические цепи</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 82</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/516790-prezentatsiya-vozvrashchennyy-narod-deportatsiya-krymsko-tatarskogo"> <img src="/img/tmb/6/516790/c7d7f788d6a95ab4e250cb79d2f41d69-210x.jpg" alt="Презентация Возвращенный народ . Депортация крымско-татарского народа"> <span class="desc"> <span>Презентация Возвращенный народ . Депортация крымско-татарского народа</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 128</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/metod-obosnovaniya-novyh-idey-zolotaya-rybka"> <img src="/img/tmb/14/1302440/cbd8381e19a18d80b22111f400dbc40e-210x.jpg" alt="Метод обоснования новых идей Золотая рыбка (метод разложения и синтеза фантастических идей)"> <span class="desc"> <span>Метод обоснования новых идей Золотая рыбка (метод разложения и синтеза фантастических идей)</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 100</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/604866-mlit-yamaletdinovty-myamaletdinov-uy-yot-povesynda"> <img src="/img/tmb/7/604866/b91afd3ec103724ddf1196146235b5e9-210x.jpg" alt="Мәүлит Ямалетдиновтың М.Ямалетдинов. Һуңғы йот повесында халыҡ ижады жанрҙары һәм һүрәтләү саралары темаһына презентация"> <span class="desc"> <span>Мәүлит Ямалетдиновтың М.Ямалетдинов. Һуңғы йот повесында халыҡ ижады жанрҙары һәм һүрәтләү саралары темаһына презентация</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 137</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/konstruirovanie-iz-stroitelnogo-materiala-prezentatsiya-prezentatsiya-1"> <img src="/img/tmb/9/832790/977f0438535a5506d72dc928c83ec082-210x.jpg" alt="Конструирование из строительного материала (презентация) презентация к уроку по теме"> <span class="desc"> <span>Конструирование из строительного материала (презентация) презентация к уроку по теме</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 78</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/biznes-plan-sportivno-razvlekatelnogo-tsentra"> <img src="/img/tmb/14/1389025/cd66d112734bc672877aa68354feb8bd-210x.jpg" alt="Бизнес- план спортивно- развлекательного центра"> <span class="desc"> <span>Бизнес- план спортивно- развлекательного центра</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 143</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/608333-logicheskie-vyskazyvaniya-i-grafy-dlya-1"> <img src="/img/tmb/7/608333/1bb2e7843ddc9b8f02cca4c37934112e-210x.jpg" alt="Логические высказывания и графы для 1 класса к внеурочному занятию по программе Логические игры"> <span class="desc"> <span>Логические высказывания и графы для 1 класса к внеурочному занятию по программе Логические игры</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 99</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/prezentatsiya-maslenitsa-prezentatsiya-uroka-dlya-interaktivnoy"> <img src="/img/tmb/8/779184/51c2ca48b286201988ab746308e624f9-210x.jpg" alt="Презентация Масленица презентация урока для интерактивной доски (средняя, старшая, подготовительная группа)"> <span class="desc"> <span>Презентация Масленица презентация урока для интерактивной доски (средняя, старшая, подготовительная группа)</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 92</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/vladimir-galaktionovich-korolenko1853-1921"> <img src="/img/tmb/14/1302493/f7fa5ccd88929cb9f462ceebfb17d057-210x.jpg" alt="Владимир Галактио́нович Короле́нко (1853-1921)."> <span class="desc"> <span>Владимир Галактио́нович Короле́нко (1853-1921).</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 86</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/pasha-v-germanii-ostern"> <img src="/img/tmb/14/1344437/1051aa8a949eae05e2ab7a52a02b8ef5-210x.jpg" alt="Пасха в Германии - Ostern"> <span class="desc"> <span>Пасха в Германии - Ostern</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 102</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/razvivayushchie-igry-kak-sredstvo-formirovaniya-poznavatelnyh-1"> <img src="/img/tmb/9/894133/93d4d7763ef6a661ebad3fe78a7bcc1e-210x.jpg" alt="Развивающие игры как средство формирования познавательных способностей детей дошкольного возраста методическая разработка"> <span class="desc"> <span>Развивающие игры как средство формирования познавательных способностей детей дошкольного возраста методическая разработка</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 126</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/trebovaniya-i-rekomendatsii-k-sozdaniyu-multimediynoyprezentatsii"> <img src="/img/tmb/13/1230843/61204b8d0f4c610d5f8c05d21a42ade6-210x.jpg" alt="Требования и рекомендации к созданию мультимедийнойпрезентации к защите курсовой работе"> <span class="desc"> <span>Требования и рекомендации к созданию мультимедийнойпрезентации к защите курсовой работе</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 95</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/absolyutizm-vostok"> <img src="/img/tmb/13/1294934/7eedbe264f9ea14a3df7c6c6346f6d89-210x.jpg" alt="Абсолютизм: Восток"> <span class="desc"> <span>Абсолютизм: Восток</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 141</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/592921-zanyatie-s-pervoklassnikami-ogonyok-znakomstva"> <img src="/img/tmb/6/592921/a86e81fb5b633eace6f6bde0c3940790-210x.jpg" alt="Занятие с первоклассниками Огонёк знакомства"> <span class="desc"> <span>Занятие с первоклассниками Огонёк знакомства</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 137</span> </span> </a> </div> <div class="clear"></div> </div> </div> </div> </div> <script src="/templates/presentation/js/script.js?7ae5a315ef1850f1ab2723f8f8484030"></script> </body> </html>