Что такое 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-11464146-5 --> <div id="yandex_rtb_R-A-11464146-5"></div> <script> window.yaContextCb.push(() => { Ya.Context.AdvManager.render({ "blockId": "R-A-11464146-5", "renderTo": "yandex_rtb_R-A-11464146-5" }) }) </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>Количество просмотров: 100</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="e84a75f15749360e9ff1933226a42f33" 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-11464146-1 --> <div id="yandex_rtb_R-A-11464146-1"></div> <script> window.yaContextCb.push(() => { Ya.Context.AdvManager.render({ "blockId": "R-A-11464146-1", "renderTo": "yandex_rtb_R-A-11464146-1" }) }) </script></div> </div> <div class="list related"> <h2>Похожие презентации</h2> <div class="wrapper"> <a href="/uncategorized/umk-shkola-rossii-3776"> <img src="/img/tmb/9/810996/33bf99cf8dcfd01c3c3354b0c99485e9-210x.jpg" alt="УМК Школа России"> <span class="desc"> <span>УМК Школа России</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 56</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/prezentatsiya-prezentatsiya-k-uroku-60"> <img src="/img/tmb/9/808352/ec6e3737a7ce465f88493dbf6eb11a50-210x.jpg" alt="презентация презентация к уроку"> <span class="desc"> <span>презентация презентация к уроку</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 67</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/kruzhok-umelye-ruchki-prezentatsiya-k-uroku"> <img src="/img/tmb/8/770886/be980c3929d4bfd25d9b6cc99606b960-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/issledovatelskiy-proekt-ya-vybirayu-sport"> <img src="/img/tmb/9/819909/832356f2a77532267c68abfc439990fc-210x.jpg" alt="Исследовательский проект Я выбираю спорт"> <span class="desc"> <span>Исследовательский проект Я выбираю спорт</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 158</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/pamyatka-dlya-roditeley-kak-otnositsya-k"> <img src="/img/tmb/8/772714/498598d72fef985bcbea27415eaeaed9-210x.jpg" alt="Памятка для родителей Как относиться к отметкам ребенка классный час (2 класс)"> <span class="desc"> <span>Памятка для родителей Как относиться к отметкам ребенка классный час (2 класс)</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 162</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/gzhel-5"> <img src="/img/tmb/9/843300/c0e6aa4511401451cdeec608625da08c-210x.jpg" alt="gzhel"> <span class="desc"> <span>gzhel</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 115</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/konsultatsiya-dlya-pedagogov-chem-otlichayutsya-formirovanie"> <img src="/img/tmb/9/854362/37a981fb28b81e8cc1df67f46f3add0e-210x.jpg" alt="Консультация для педагогов Чем отличаются формирование универсальных учебных действий в школе от развития целевых ориентиров готовности в детском саду? консультация (подготовительная группа)"> <span class="desc"> <span>Консультация для педагогов Чем отличаются формирование универсальных учебных действий в школе от развития целевых ориентиров готовности в детском саду? консультация (подготовительная группа)</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 110</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/646522-prezentatsiya-po-kursu-odnkr-na-temu"> <img src="/img/tmb/7/646522/0a9d30b4d6f8730a0f5ac7cd26ed3ee6-210x.jpg" alt="Презентация по курсу ОДНКР на тему Православные монастыри (6 класс)"> <span class="desc"> <span>Презентация по курсу ОДНКР на тему Православные монастыри (6 класс)</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 201</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/raduga-2_"> <img src="/img/tmb/13/1246978/1454fcf317f48a1e5a56d9b617771264-210x.jpg" alt="Радуга"> <span class="desc"> <span>Радуга</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-o-detskom-travmatizme-prezentatsiya-k"> <img src="/img/tmb/8/791300/7c920413dfc1a505b1f6369efad5edf7-210x.jpg" alt="презентация о детском травматизме презентация к уроку (старшая группа)"> <span class="desc"> <span>презентация о детском травматизме презентация к уроку (старшая группа)</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 129</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/pozdnie-oslozhneniya-infarkta-miokarda"> <img src="/img/tmb/13/1227775/0750af815c09866f232824e0d87cb735-210x.jpg" alt="Поздние осложнения инфаркта миокарда."> <span class="desc"> <span>Поздние осложнения инфаркта миокарда.</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 140</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/neposredstvenno-obrazovatelnaya-deyatelnost-v-sredney-gruppe"> <img src="/img/tmb/8/734025/64e5493b294ca9cdce2e39d0537b0c81-210x.jpg" alt="Непосредственно-образовательная деятельность в средней группе (Эксперимент с воздухом) с презентацией Злой и добрый ветер опыты и эксперименты (средняя группа) по теме"> <span class="desc"> <span>Непосредственно-образовательная деятельность в средней группе (Эксперимент с воздухом) с презентацией Злой и добрый ветер опыты и эксперименты (средняя группа) по теме</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 150</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/555042-prezentatsiya-po-proektu-goryachiy-kley-i"> <img src="/img/tmb/6/555042/1fa67992b9378652d3fe1d0c2f149eb7-210x.jpg" alt="Презентация по проекту Горячий клей и его возможности"> <span class="desc"> <span>Презентация по проекту Горячий клей и его возможности</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 131</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/metodicheskaya-razrabotka-master-klass-dlya-roditeley"> <img src="/img/tmb/9/830400/40fe854789e4fadd79bfb6b0fe313759-210x.jpg" alt="Методическая разработка Мастер - класс для родителей по развитию мелкой моторики у дошкольников методическая разработка (средняя группа)"> <span class="desc"> <span>Методическая разработка Мастер - класс для родителей по развитию мелкой моторики у дошкольников методическая разработка (средняя группа)</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 41</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/velikiy-dar-na-mnogie-veka"> <img src="/img/tmb/13/1246339/0f0b306c73c4115e15f818acd4f52ea6-210x.jpg" alt="Великий дар на многие века"> <span class="desc"> <span>Великий дар на многие века</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 121</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/521189-urok-obobshchayushchiy-tema-spetsoborudovanie"> <img src="/img/tmb/6/521189/61f0549daf6fe6acda591e56c2498cb7-210x.jpg" alt="Урок обобщающий, Тема: спецоборудование"> <span class="desc"> <span>Урок обобщающий, Тема: спецоборудование</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 136</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/st-achinsk-2"> <img src="/img/tmb/14/1311624/a03a4cc4acc059f1e45232f6a8178cba-210x.jpg" alt="ст. Ачинск-2"> <span class="desc"> <span>ст. Ачинск-2</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 146</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/wwwpfavesru"> <img src="/img/tmb/14/1311188/a16c3f431f9479fbda1dec77f9cb1076-210x.jpg" alt="Www.pfaves.ru"> <span class="desc"> <span>Www.pfaves.ru</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 132</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/zanyatie-prezentatsiya-k-uroku-1-klass-1"> <img src="/img/tmb/9/835721/5b82ae0ee7a0f25a4852efbe5a5caa15-210x.jpg" alt="Занятие презентация к уроку (1 класс)"> <span class="desc"> <span>Занятие презентация к уроку (1 класс)</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 105</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/prezentatsiya-blokada-leningrada-metodicheskaya-razrabotka-starshaya"> <img src="/img/tmb/9/850720/85221591c6294a1fd19fca133cf65fe3-210x.jpg" alt="Презентация. Блокада Ленинграда методическая разработка (старшая группа)"> <span class="desc"> <span>Презентация. Блокада Ленинграда методическая разработка (старшая группа)</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 42</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/msfo-2-zapasy_"> <img src="/img/tmb/14/1304392/359d290f36297fa7fc505606fc7fee4f-210x.jpg" alt="МСФО 2 Запасы"> <span class="desc"> <span>МСФО 2 Запасы</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 101</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/istoriya-i-vidy-plavaniya"> <img src="/img/tmb/13/1275945/8690a7b82a34ab771a80dce68e3315bb-210x.jpg" alt="История и виды плавания"> <span class="desc"> <span>История и виды плавания</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 106</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/roditelskoe-sobranie-4-chetvert"> <img src="/img/tmb/8/740818/95d3b8d3162239915cba50062586c514-210x.jpg" alt="roditelskoe sobranie 4 chetvert"> <span class="desc"> <span>roditelskoe sobranie 4 chetvert</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 103</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/aladdinhoroshiy-kalyan-dlya-nastoyashchih-tseniteley"> <img src="/img/tmb/13/1254906/567c7a10523df47437680c2ffa42c1e7-210x.jpg" alt="AladdinХороший кальян для настоящих ценителей"> <span class="desc"> <span>AladdinХороший кальян для настоящих ценителей</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 152</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/kontsept-restorana-karaokena-bis"> <img src="/img/tmb/14/1341147/706071fd6852931840989aebc6dfa019-210x.jpg" alt="Концепт ресторана-караокеНа Бис"> <span class="desc"> <span>Концепт ресторана-караокеНа Бис</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 101</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/prezentatsiya-k-roditelskomu-sobraniyu-prezentatsiya-k-23"> <img src="/img/tmb/10/913901/656f242427fdca59ccbfb3fff55efa90-210x.jpg" alt="Презентация к родительскому собранию презентация к уроку"> <span class="desc"> <span>Презентация к родительскому собранию презентация к уроку</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 131</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/prezentatsiya-razvitie-navykov-konstruktivnogo-obshcheniya-prezentatsiya"> <img src="/img/tmb/9/849163/53c43ee1f9ce9054784849a393cec24c-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/630670-prezentatsiya-formirovanie-kommunikativnyh-uud-na-urokah-8"> <img src="/img/tmb/7/630670/bcf6c7eb06ce12191515b738e34060d2-210x.jpg" alt="Презентация Формирование коммуникативных УУД на уроках литературного чтения в условиях реализации ФГОС"> <span class="desc"> <span>Презентация Формирование коммуникативных УУД на уроках литературного чтения в условиях реализации ФГОС</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 132</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/613020-istoriya-upakovki"> <img src="/img/tmb/7/613020/4385b1415ddf880355ddd1efcc0949a1-210x.jpg" alt="История упаковки"> <span class="desc"> <span>История упаковки</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 268</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/portfolio-vospitatelya-detskogo-sada-prezentatsiya-k-2"> <img src="/img/tmb/10/907539/a1dcc04bd84fc814fa426b99b907b0ed-210x.jpg" alt="Портфолио воспитателя детского сада презентация к уроку по теме"> <span class="desc"> <span>Портфолио воспитателя детского сада презентация к уроку по теме</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 119</span> </span> </a> </div> <div class="clear"></div> </div> </div> </div> </div> <script src="/templates/presentation/js/script.js?7ae5a315ef1850f1ab2723f8f8484030"></script> </body> </html>