Основы сайтостроения на языках HTML и CSS Начать обучение Красноярск -

Создание и редактирование форм
Занятия № 18 - 28
© Surgucheva

Irina

Курс ведёт :

Сургучёва
Ирина Николаевна

Для связи:
E-mail: lara1233@yandex.ru
Skype: lovez_snov_irena

CSS». На прошлом занятии мы рассмотрели с вами тему: Создание

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

Понятие «формы». Примеры форм.
Как происходит обработка форм?
Тег формы и его атрибуты
Каркас формы
Текстовые поля форм

Часть 1

использованием элементов HTML. Назначением формы является сбор информации от пользователей.

После того как пользователь заполнит форму и запускает процесс ее обработки, информация из нее попадает в программу, работающую на сервере. Другая программа под названием Common Gateway Interface (CGI) обрабатывает ее. Таким образом, пользователь может интерактивно взаимодействовать с сервером Web через Internet.
Область применения форм не ограничена отправкой данных на сервер, с помощью клиентских скриптов можно получить доступ к любому элементу формы, изменять его и применять по своему усмотрению. Документ может содержать любое количество форм, но одновременно на сервер может быть отправлена только одна форма. По этой причине данные форм должны быть независимы друг от друга.
Для отправки формы на сервер используется кнопка Submit, того же можно добиться, если нажать клавишу Enter в пределах формы. Если кнопка Submit отсутствует в форме, клавиша Enter имитирует ее использование, но только в том случае, когда в форме имеется только один элемент . Если таких элементов два и более, нажатие на не вызовет никакого результата.

Перейдите на следующий слайд, чтобы просмотреть примеры форм

Выпадающий список
4. Список с полосой прокрутки

пример

который указывает браузеру, что и как нужно отображать. С помощью

языка html мы сможем создать: текст, поля, меню, кнопки для форм, но вот обработать данные введенные в форму без помощи другого языка мы не сможем. HTML не может обрабатывать данные, для этого существуют специальные серверные языки программирования, например язык PHP. Поэтому форма, чтоб она работала должна быть связана с серверным обработчиком, который будет обрабатывать данные полученные из формы. Откройте схему работы обработки данных формы и рассмотрите её (схема представлена на следующем слайде).
Описание схемы:
Пользователь заходит на web-сайт и заполняет форму, затем нажимает кнопку ОТПРАВИТЬ. В этот момент данные из формы отправляются обработчику, у нас это будет документ formdata.php (именно этот файл будет заниматься обработкой). Далее все зависит от того, что прописано в файле-обработчике, то что хочет владелец сайта, например он хочет получать e-mail письмо с данными, которые были введены в форму посетителем сайта (пользователем). В файле PHP-обработчика прописана инструкция, что делать с данными (в данном примере: отправлять данные владельцу сайта на указанный e-mail). Результат владелец сайта получит письмо с данными введенными в форму.
И хотя у нас курс не предусматривает изучение яыка php, тем не менее мы рассмотрим некоторые элементы, для того, чтобы вы смогли создать полноценную рабочую форму (3 часть занятия).

Прочитать и просмотреть схему обязательно!

сайта

для обмена данными между пользователем и сервером.
Указывает обработчик, к которому

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

атрибут action

тег form

Синтаксис:

...

файлу (URL).
Тег формы и его атрибуты
Синтаксис:

...

атрибут autocomplete
Автозаполнение

производит браузер, который запоминает написанные при первом вводе значения, а затем подставляет их при повторном наборе в поля формы. При этом автозаполнение может быть отключено в настройках браузера и не может быть в таком случае изменено при помощи атрибута autocomplete. К примеру, включение автозаполнения в браузере Chrome (можно посмотреть на следующем слайде).

из которого можно выбрать необходимое
Синтаксис:
...
Тег формы и

его атрибуты

on
Включает автозаполнение формы.
off
Отключает автозаполнение. Это значение обычно используется для отмены сохранения в браузере важных данных (паролей, номеров банковских карт), а также редко вводимых или уникальных данных.

при их отправке на сервер. Обычно устанавливать значение атрибута enctype не требуется,

данные вполне правильно понимаются на стороне сервера. Однако если используется поле для отправки файла (input type="file"), следует определить атрибут enctype как multipart/form-data.

Синтаксис:

...

application/x-www-form-urlencoded
Вместо пробелов ставится +, символы вроде русских букв кодируются их шестнадцатеричными значениями (например, %D0%90%D0%BD%D1%8F вместо Аня).
multipart/form-data
Данные не кодируются. Это значение применяется при отправке файлов.
text/plain
Пробелы заменяются знаком +, буквы и другие символы не кодируются.

и его атрибуты
Значение атрибута method не зависит от регистра. Различают два метода —

get и post.
get
Этот метод является одним из самых распространенных и предназначен для получения требуемой информации и передачи данных в адресной строке. Пары «имя=значение» присоединяются в этом случае к адресу после вопросительного знака и разделяются между собой амперсандом (символ &). Удобство использования метода get заключается в том, что адрес со всеми параметрами можно использовать неоднократно, сохранив его, например, в закладки браузера, а также менять значения параметров прямо в адресной строке.
post
Метод post посылает на сервер данные в запросе браузера. Это позволяет отправлять большее количество данных, чем доступно методу get, поскольку у него установлено ограничение в 4 Кб. Большие объемы данных используются в форумах, почтовых службах, заполнении базы данных, при пересылке файлов и др.

используется для доступа к ее элементам через скрипты.
Синтаксис:
...
В качестве

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

 атрибут target

После того, как обработчик формы получает данные, он возвращает результат в виде HTML-документа. Вы можете определить окно, в которое будет загружаться итоговая web-страница. Для этого используется атрибут target, в качестве его значения используется имя окна или фрейма. Если target не установлен, возвращаемый результат показывается в текущем окне.

Тег формы и его атрибуты

имя окна или фрейма, заданное атрибутом name. Если установлено несуществующее имя,

то будет открыто новое окно. В качестве зарезервированных имен можно указывать следующие:
_blank
Загружает страницу в новое окно браузера.
_self
Загружает страницу в текущее окно.
_parent
Загружает страницу во фрейм-родитель, если фреймов нет, то это значение работает как _self.
_top
Отменяет все фреймы и загружает страницу в полном окне браузера, если фреймов нет, то это значение работает как _self.

создана на рабочем столе и создайте в ней папку «Формы».
Откройте

программу Notepad++ и создайте новый документ «index.html» сохраните его в папку «Формы».
Из любого ранее созданного нами документа скопируйте в новый документ index.html, основную структуру html-документа, чтобы нам не прописывать эти данные, измените название в

ней:
Основные атрибуты, которые прописываются для формы это: action, method,

name. Их мы рассмотрели в предыдущих слайдах, можете вернуться и еще раз прочитать за что отвечает, каждый из перечисленных атрибутов. На скриншоте представлена запись, которая должна быть сделана у вас.

Каркас формы

Ничего не видно? Верно, так и должно быть. У нас

создан каркас формы, но не один элемент еще не добавлен. В следующем разделе нашего урока мы рассмотрим создание разных элементов формы.

ввод имени, ввод E-mail.
Тег  является одним из разносторонних элементов формы и

позволяет создавать разные элементы интерфейса и обеспечить взаимодействие с пользователем. Главным образом  предназначен для создания текстовых полей, различных кнопок, переключателей и флажков. Атрибутов у данного тега очень много, мы рассмотрим по ходу занятия только основные, остальные вы сможете самостоятельно посмотреть в Internet: http://uroki-html.ru/tags/tag_input.php

При помощи данного тега создаётся большинство элементов формы. переводится как ВВОД.

Сообщает браузеру, к какому типу относится элемент формы.

атрибут type тега

каркас формы, давайте теперь добавим текстовое поле.
6. Добавим следующую запись:

с вами создали, но посетителю будет непонятно, что нужно в

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

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

поле можно лишь тогда, когда курсор появляется в этом поле по щелчку мыши в нём. Хотелось бы сделать так, чтобы активировать поле можно было щелкнув мышкой даже по тексту «Введите ваше имя», здесь есть одна хитрость, а именно тег, который позволяет связать метку текста с элементом формы. Давайте рассмотрим его.

Тег

Тег  устанавливает связь между определенной меткой, в качестве которой обычно выступает текст, и элементом формы (,, ). Такая связь необходима, чтобы изменять значения элементов формы при нажатии курсором мыши на текст. Закрывающий тег обязателен!<br> </div> <div class="image"> <a href="/img/tmb/4/362270/d18b2ad9280287e68a43b7b35d9fd954-800x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Текстовые поля форм8. Сохраните. Просмотрите в браузере, что получилось.Теперь наша запись имеет правильный вид, но активировать ввод имени в текстовое поле можно лишь тогда, когда курсор появляется в этом поле по щелчку мыши в нём. Хотелось бы сделать так, чтобы активировать поле можно было щелкнув мышкой даже по тексту «Введите ваше имя», здесь есть одна хитрость, а именно тег, который позволяет связать метку текста с элементом формы. Давайте рассмотрим его.Тег Тег  устанавливает связь между определенной меткой, в качестве которой обычно выступает текст, и элементом формы (,, ). Такая связь необходима, чтобы изменять значения элементов формы при нажатии курсором мыши на текст. Закрывающий тег обязателен!"><img src="/img/tmb/4/362270/d18b2ad9280287e68a43b7b35d9fd954-800x.jpg" title="Основы сайтостроения на языках HTML и CSS Начать обучение Красноярск - Текстовые поля форм8. Сохраните. Просмотрите в браузере, что получилось.Теперь наша запись" alt="Текстовые поля форм8. Сохраните. Просмотрите в браузере, что получилось.Теперь наша запись имеет правильный вид, но активировать ввод"></a> </div> <hr> </div> <div class="descrip" id="slide23"> <h2><a href="/img/tmb/4/362270/5902bbde3cf4ebac1ae7aa6058d15090-800x.jpg" target="_blank">Слайд 23</a>Текстовые поля форм<br>9. Ниже представлена запись как нужно правильно прописывать</h2> <div class="text"> <h3>тег . Внесите изменения в свой документ. Сохраните и просмотрите</h3> в браузере.<br><p>Внимание! Если вы всё правильно сделали, то щёлкая кнопкой мыши по тексту «Введите ваше имя:» у вас должен мигать курсор в текстовом поле. Пожалуйста используйте данный тег всегда для форм – это очень удобно при их заполнении.<br><p>атрибут size тега <input><br><p>Ширина текстового поля, которое определяется числом символов моноширинного шрифта. Иными словами, ширина задается количеством близстоящих букв одинаковой ширины по горизонтали. Если размер шрифта изменяется с помощью стилей, ширина также соответственно меняется.<br> </div> <div class="image"> <a href="/img/tmb/4/362270/5902bbde3cf4ebac1ae7aa6058d15090-800x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Текстовые поля форм9. Ниже представлена запись как нужно правильно прописывать тег . Внесите изменения в свой документ. Сохраните и просмотрите в браузере.Внимание! Если вы всё правильно сделали, то щёлкая кнопкой мыши по тексту «Введите ваше имя:» у вас должен мигать курсор в текстовом поле. Пожалуйста используйте данный тег всегда для форм – это очень удобно при их заполнении.атрибут size тега Ширина текстового поля, которое определяется числом символов моноширинного шрифта. Иными словами, ширина задается количеством близстоящих букв одинаковой ширины по горизонтали. Если размер шрифта изменяется с помощью стилей, ширина также соответственно меняется."><img src="/img/tmb/4/362270/5902bbde3cf4ebac1ae7aa6058d15090-800x.jpg" title="Основы сайтостроения на языках HTML и CSS Начать обучение Красноярск - Текстовые поля форм9. Ниже представлена запись как нужно правильно прописывать тег" alt="Текстовые поля форм9. Ниже представлена запись как нужно правильно прописывать тег . Внесите изменения в свой документ."></a> </div> <hr> </div> <div class="descrip" id="slide24"> <h2><a href="/img/thumbs/d51d24b55c213c201b17569f330174ca-800x.jpg" target="_blank">Слайд 24</a>Текстовые поля форм<br>10. По умолчанию ширина текстового поля = 20</h2> <div class="text"> <h3>символам. Но иногда, такого размера недостаточно, для этого используют атрибут</h3> size, который устанавливает нужное количество символов в текстовом поле. Давайте пропишем данный параметр в нашем документе и посмотрим, какие изменения у нас произойдут.<br><p>Результат :<br><p>Как вы видите у меня поле стало в два раза больше.<br> </div> <div class="image"> <a href="/img/thumbs/d51d24b55c213c201b17569f330174ca-800x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Текстовые поля форм10. По умолчанию ширина текстового поля = 20 символам. Но иногда, такого размера недостаточно, для этого используют атрибут size, который устанавливает нужное количество символов в текстовом поле. Давайте пропишем данный параметр в нашем документе и посмотрим, какие изменения у нас произойдут.Результат :Как вы видите у меня поле стало в два раза больше."><img src="/img/thumbs/d51d24b55c213c201b17569f330174ca-800x.jpg" title="Основы сайтостроения на языках HTML и CSS Начать обучение Красноярск - Текстовые поля форм10. По умолчанию ширина текстового поля = 20 символам." alt="Текстовые поля форм10. По умолчанию ширина текстового поля = 20 символам. Но иногда, такого размера недостаточно, для"></a> </div> <hr> </div> <div class="descrip" id="slide25"> <h2><a href="/img/tmb/4/362270/bd81e00067d1f6159cdabec1bb4ff4db-800x.jpg" target="_blank">Слайд 25</a>Текстовые поля форм<br>11. Иногда нужно наоборот ввести ограничение на количество</h2> <div class="text"> <h3>вводимых символов в поле. Для этого нужно: первое, в пояснении</h3> добавить текст, что поле ограничено и второе, прописать еще один атрибут, который ограничивает ввод символов в текстовое поле. Рассмотрим данный атрибут:<br><p>атрибут maxlength тега <input><br><p>Устанавливает максимальное число символов, которое может быть введено пользователем в текстовом поле. Когда это количество достигается при наборе, дальнейший ввод становится невозможным.<br><p>Синтаксис:<br><input type="text" maxlength="число"><br> </div> <div class="image"> <a href="/img/tmb/4/362270/bd81e00067d1f6159cdabec1bb4ff4db-800x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Текстовые поля форм11. Иногда нужно наоборот ввести ограничение на количество вводимых символов в поле. Для этого нужно: первое, в пояснении добавить текст, что поле ограничено и второе, прописать еще один атрибут, который ограничивает ввод символов в текстовое поле. Рассмотрим данный атрибут:атрибут maxlength тега Устанавливает максимальное число символов, которое может быть введено пользователем в текстовом поле. Когда это количество достигается при наборе, дальнейший ввод становится невозможным.Синтаксис:"><img src="/img/tmb/4/362270/bd81e00067d1f6159cdabec1bb4ff4db-800x.jpg" title="Основы сайтостроения на языках HTML и CSS Начать обучение Красноярск - Текстовые поля форм11. Иногда нужно наоборот ввести ограничение на количество вводимых" alt="Текстовые поля форм11. Иногда нужно наоборот ввести ограничение на количество вводимых символов в поле. Для этого нужно:"></a> </div> <hr> </div> <div class="descrip" id="slide26"> <h2><a href="/img/thumbs/aebd464fe63960f8d5455ec800a3cfce-800x.jpg" target="_blank">Слайд 26</a>Текстовые поля форм<br>12. Сохраните изменения и просмотрите в браузере как</h2> <div class="text"> <h3>это выглядит. Вот что получилось у меня:<br>Внимание! Если вы всё</h3> правильно сделали, то более 10 символов вы не сможете ввести в данное текстовое поле. Так как число 10 состоит из двух цифр 1 и 0, то десятым символом получается 1, а 0 уже 11, поэтому данная цифра вводится уже не будет.<br><p>13. Давайте создадим поле для ввода пароля. Чтобы создать поле для ввода пароля необходимо внести всего два изменения: первое, в пояснительный текст, что нужно вводить в данное поле, и второе, изменить значение атрибута type. Давайте скопируем созданную нами запись для поля «Введите ваше имя:» и произведем следующие изменения:<br> </div> <div class="image"> <a href="/img/thumbs/aebd464fe63960f8d5455ec800a3cfce-800x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Текстовые поля форм12. Сохраните изменения и просмотрите в браузере как это выглядит. Вот что получилось у меня:Внимание! Если вы всё правильно сделали, то более 10 символов вы не сможете ввести в данное текстовое поле. Так как число 10 состоит из двух цифр 1 и 0, то десятым символом получается 1, а 0 уже 11, поэтому данная цифра вводится уже не будет.13. Давайте создадим поле для ввода пароля. Чтобы создать поле для ввода пароля необходимо внести всего два изменения: первое, в пояснительный текст, что нужно вводить в данное поле, и второе, изменить значение атрибута type. Давайте скопируем созданную нами запись для поля «Введите ваше имя:» и произведем следующие изменения:"><img src="/img/thumbs/aebd464fe63960f8d5455ec800a3cfce-800x.jpg" title="Основы сайтостроения на языках HTML и CSS Начать обучение Красноярск - Текстовые поля форм12. Сохраните изменения и просмотрите в браузере как это" alt="Текстовые поля форм12. Сохраните изменения и просмотрите в браузере как это выглядит. Вот что получилось у меня:Внимание!"></a> </div> <hr> </div> <div class="descrip" id="slide27"> <h2><a href="/img/tmb/4/362270/9ebde413d6449e942a1e3d0f22de61a6-800x.jpg" target="_blank">Слайд 27</a>Текстовые поля форм<br>У вас должна получиться следующая запись:<br>Сохраните и проверьте</h2> <div class="text"> <h3>в браузере. В поле пароля должны появиться – круглые маркеры,</h3> при вводе символов – значит вы сделали всё правильно:<br> </div> <div class="image"> <a href="/img/tmb/4/362270/9ebde413d6449e942a1e3d0f22de61a6-800x.jpg" class="js_fancybox" data-fancybox="slides" data-caption="Текстовые поля формУ вас должна получиться следующая запись:Сохраните и проверьте в браузере. В поле пароля должны появиться – круглые маркеры, при вводе символов – значит вы сделали всё правильно:"><img src="/img/tmb/4/362270/9ebde413d6449e942a1e3d0f22de61a6-800x.jpg" title="Основы сайтостроения на языках HTML и CSS Начать обучение Красноярск - Текстовые поля формУ вас должна получиться следующая запись:Сохраните и проверьте в" alt="Текстовые поля формУ вас должна получиться следующая запись:Сохраните и проверьте в браузере. В поле пароля должны появиться"></a> </div> <hr> </div> </div> <div class="custom" > <!-- Yandex.RTB R-A-448123-10 --> <div id="yandex_rtb_R-A-448123-10"></div> <script type="text/javascript"> (function(w, d, n, s, t) { w[n] = w[n] || []; w[n].push(function() { Ya.Context.AdvManager.render({ blockId: "R-A-448123-10", renderTo: "yandex_rtb_R-A-448123-10", async: true }); }); t = d.getElementsByTagName("script")[0]; s = d.createElement("script"); s.type = "text/javascript"; s.src = "//an.yandex.ru/system/context.js"; s.async = true; t.parentNode.insertBefore(s, t); })(this, this.document, "yandexContextAsyncCallbacks"); </script></div> <div class="url" id="download"><a href="/uncategorized/osnovy-saytostroeniya-na-yazykahhtml-i-cssnachat/download">Скачать презентацию</a></div> </div> <div class="right"> <div class="banners"> <div class="custom" > <!-- Yandex.RTB R-A-448123-2 --> <div id="yandex_rtb_R-A-448123-2"></div> <script type="text/javascript"> (function(w, d, n, s, t) { w[n] = w[n] || []; w[n].push(function() { Ya.Context.AdvManager.render({ blockId: "R-A-448123-2", renderTo: "yandex_rtb_R-A-448123-2", async: true }); }); t = d.getElementsByTagName("script")[0]; s = d.createElement("script"); s.type = "text/javascript"; s.src = "//an.yandex.ru/system/context.js"; s.async = true; t.parentNode.insertBefore(s, t); })(this, this.document, "yandexContextAsyncCallbacks"); </script></div> </div> <div class="list related"> <h2>Похожие презентации</h2> <div class="wrapper"> <a href="/uncategorized/sovmestnaya-deyatelnost--innovatsionnyy-resurs-realizatsii"> <img src="/img/thumbs/82b037bf76392442be419880f1bf5a47-800x.jpg" alt="Совместная деятельность – инновационный ресурс реализации ФГОС НОО"> <span class="desc"> <span>Совместная деятельность – инновационный ресурс реализации ФГОС НОО</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 240</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/tvorchestvo-as-pushkina"> <img src="/img/thumbs/1889606a776278059e0e3d1b987a6945-800x.jpg" alt="Творчество А.С. Пушкина"> <span class="desc"> <span>Творчество А.С. Пушкина</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 437</span> </span> </a> </div> <div class="custom" > <!-- Yandex.RTB R-A-448123-12 --> <script>window.yaContextCb.push(()=>{ Ya.Context.AdvManager.render({ type: 'fullscreen', blockId: 'R-A-448123-12' }) })</script></div> <div class="wrapper"> <a href="/uncategorized/urok-opk-1-klass-hramy"> <img src="/img/thumbs/0b805f3583fe5e0453975a187ceab827-800x.jpg" alt="Урок ОПК 1 класс «Храмы»"> <span class="desc"> <span>Урок ОПК 1 класс «Храмы»</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 430</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/logicheskie-funktsii-v-excel"> <img src="/img/thumbs/b0f10cdce235514538b97196c5083f3e-800x.jpg" alt="Логические функции в Excel"> <span class="desc"> <span>Логические функции в Excel</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 714</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/vypusknaya-kvalifikatsionnaya-rabota-bakalavra--"> <img src="/img/thumbs/d923fe754d14a8b6735ea98da2b9b17c-800x.jpg" alt="ВЫПУСКНАЯ КВАЛИФИКАЦИОННАЯ РАБОТА БАКАЛАВРА     ВТЮРИНА ЕЛИЗАВЕТА СЕРГЕЕВНА"> <span class="desc"> <span>ВЫПУСКНАЯ КВАЛИФИКАЦИОННАЯ РАБОТА БАКАЛАВРА     ВТЮРИНА ЕЛИЗАВЕТА СЕРГЕЕВНА</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 216</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/mikrobiologiya-yaitsvypolnil-student-2-kursagruppy-18"> <img src="/img/thumbs/e5429c64a326909f355654352b414a03-800x.jpg" alt="Микробиология яиц Выполнил: студент 2 курса Группы: 18-ТП Стукалов Дмитрий"> <span class="desc"> <span>Микробиология яиц Выполнил: студент 2 курса Группы: 18-ТП Стукалов Дмитрий</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 209</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/sotsialnye-vyplaty-v-priozerskom-rayone-leningradskoy"> <img src="/img/thumbs/6080d0451c339691cfd59c0f77900d3a-800x.jpg" alt="Социальные выплаты в Приозерском районе Ленинградской области на 1 апреля 2017"> <span class="desc"> <span>Социальные выплаты в Приозерском районе Ленинградской области на 1 апреля 2017</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 219</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/stuzhka-chasu"> <img src="/img/thumbs/b85e4111db934f8ca511e210ec3ef56a-800x.jpg" alt="Стужка часу"> <span class="desc"> <span>Стужка часу</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 764</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/1508196023_lekciya-7ppt"> <img src="/img/thumbs/4fe8a0ac64e14341ff41dbe24454e716-800x.jpg" alt="Лекция 7.ppt"> <span class="desc"> <span>Лекция 7.ppt</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 232</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/tsvet-element-kompozitsionnogo-tvorchestva"> <img src="/img/thumbs/f1d31ef92c1ee1ae537a34adfeec141e-800x.jpg" alt="Цвет-элемент композиционного творчества"> <span class="desc"> <span>Цвет-элемент композиционного творчества</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 343</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/tvorchestvo-prospera-merime-v-literaturnom-protsesse"> <img src="/img/tmb/6/578856/f7764e31e197a3c7b1a2408c3bce5278-800x.jpg" alt="Творчество Проспера Мериме в литературном процессе Франции"> <span class="desc"> <span>Творчество Проспера Мериме в литературном процессе Франции</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 220</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/antibiotiki-9"> <img src="/img/thumbs/82c4eb8bd138ea39dd0838ae84ba4462-800x.jpg" alt="Антибиотики"> <span class="desc"> <span>Антибиотики</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 326</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/lektsiya-istoriya-informatiki-i-vychislitelnoy-tehnikiistoriya"> <img src="/img/thumbs/e964c5a193aa3f316bdde61125ee1814-800x.jpg" alt="Лекция История информатики и вычислительной техники История информатики и"> <span class="desc"> <span>Лекция История информатики и вычислительной техники История информатики и</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 263</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/autekologchn-dosldzhennya-tvarin-amurskiy-tigr-panthera"> <img src="/img/thumbs/8589b39ea8c738360745bd17cf13086b-800x.jpg" alt="Аутекологічні дослідження тварин Амурський тигр ( Panthera tigris altaica"> <span class="desc"> <span>Аутекологічні дослідження тварин Амурський тигр ( Panthera tigris altaica</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 271</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/4-raund-3"> <img src="/img/tmb/7/628023/636cbf5da7751eb3ca61359533449b0f-800x.jpg" alt="4 раунд"> <span class="desc"> <span>4 раунд</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 148</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/ispolzovanie-metoda-krugovoy-trenirovki-dlya-funktsionalnoy"> <img src="/img/tmb/7/621058/f4316724bfb60af6470f3dfd574a6a3c-800x.jpg" alt="Использование метода круговой тренировки для функциональной способности боксеров"> <span class="desc"> <span>Использование метода круговой тренировки для функциональной способности боксеров</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 255</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/pravila-povedeniya-detey-na-zheleznodorozhnom-transporte-8"> <img src="/img/tmb/6/590813/57352b0083f7ffdf0fc3d3d9bf506597-800x.jpg" alt="ПРАВИЛА ПОВЕДЕНИЯ ДЕТЕЙ НА ЖЕЛЕЗНОДОРОЖНОМ ТРАНСПОРТЕ"> <span class="desc"> <span>ПРАВИЛА ПОВЕДЕНИЯ ДЕТЕЙ НА ЖЕЛЕЗНОДОРОЖНОМ ТРАНСПОРТЕ</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 151</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/cherez-ustroystva-samoobsluzhivaniya-sberbankacherez-sistemu-sberbank"> <img src="/img/tmb/3/249774/25bd13fcbdc123a87f834dd9f81ae362-800x.jpg" alt="ЧЕРЕЗ УСТРОЙСТВА САМООБСЛУЖИВАНИЯ СБЕРБАНКА ЧЕРЕЗ СИСТЕМУ СБЕРБАНК ОНЛ @"> <span class="desc"> <span>ЧЕРЕЗ УСТРОЙСТВА САМООБСЛУЖИВАНИЯ СБЕРБАНКА ЧЕРЕЗ СИСТЕМУ СБЕРБАНК ОНЛ @</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 199</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/nanesenie-razmerov-na-chertezhah-1"> <img src="/img/tmb/7/634996/d855a37c991a80e32ece009e5fcb1c81-800x.jpg" alt="Нанесение размеров на чертежах"> <span class="desc"> <span>Нанесение размеров на чертежах</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 172</span> </span> </a> </div> <div class="wrapper"> <a href="/uncategorized/pravopisanie-pristavok-na-z-i-sa6"> <img src="/img/thumbs/2eb7b2b169778cf892a77b0808066042-800x.jpg" alt="Правописание приставок на З и С А6"> <span class="desc"> <span>Правописание приставок на З и С А6</span> <span class="views"><i class="fa fa-eye" aria-hidden="true"></i> 296</span> </span> </a> </div> <div class="clear"></div> </div> </div> </div> </div> </div> <div class="container bottom"> <div> <div class="call_back"> <h4><i class="fas fa-bullhorn"></i>Обратная связь</h4> <p>Если не удалось найти и скачать доклад-презентацию, Вы можете заказать его на нашем сайте. Мы постараемся найти нужный Вам материал и отправим по электронной почте. Не стесняйтесь обращаться к нам, если у вас возникли вопросы или пожелания:</p> <p>Email: <a href="#" class="js_hidden_email" data-address="abusetheslide" data-domain="ya.ru">Нажмите что бы посмотреть</a> </p> </div> <div class="links"> </div> <div class="whatis"> <h4><i class="fa fa-info text-red"></i>Что такое TheSlide.ru?</h4> <p>Это сайт презентации, докладов, проектов в PowerPoint. Здесь удобно  хранить и делиться своими презентациями с другими пользователями.</p> <hr /> <p><a href="/privacy">Для правообладателей</a></p> <a href="https://metrika.yandex.ru/stat/?id=48768281&from=informer" target="_blank" rel="nofollow"><img src="https://informer.yandex.ru/informer/48768281/3_1_FFFFFFFF_EFEFEFFF_0_pageviews" style="width:88px; height:31px; border:0;" alt="Яндекс.Метрика" title="Яндекс.Метрика: данные за сегодня (просмотры, визиты и уникальные посетители)" class="ym-advanced-informer" data-cid="48768281" data-lang="ru" /></a> <!--LiveInternet counter--> <script type="text/javascript"> document.write("<a href='//www.liveinternet.ru/click' "+ "target=_blank><img src='//counter.yadro.ru/hit?t16.2;r"+ escape(document.referrer)+((typeof(screen)=="undefined")?"": ";s"+screen.width+"*"+screen.height+"*"+(screen.colorDepth? screen.colorDepth:screen.pixelDepth))+";u"+escape(document.URL)+ ";h"+escape(document.title.substring(0,150))+";"+Math.random()+ "' alt='' title='LiveInternet: показано число просмотров за 24"+ " часа, посетителей за 24 часа и за сегодня' "+ "border='0' width='88' height='31'><\/a>") </script> <!--/LiveInternet--> </div> <div class="clear"></div> </div> </div> <script src="/templates/presentation/js/script.js?2f7a446f4c1827ed407306caac7b976b"></script> </body> </html>