Презентация на тему: Формы в HTML-документе. Элементы форм

Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Элементы формы
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
Формы в HTML-документе. Элементы форм
1/25
Средняя оценка: 4.5/5 (всего оценок: 92)
Код скопирован в буфер обмена
Скачать (128 Кб)
1

Первый слайд презентации: Формы в HTML-документе. Элементы форм

Изображение слайда
2

Слайд 2

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

Изображение слайда
3

Слайд 3

Написание формы состоит из нескольких шагов, которые могут быть выполнены в любом порядке: написание формы пользовательского интерфейса; реализация обработки на стороне сервера; настройка формы для связи с сервером.

Изображение слайда
4

Слайд 4

<FORM> Элементы формы </FORM>

Изображение слайда
5

Слайд 5

Атрибуты элемента <form> Атрибут Значение / описание accept-charset Список кодировок символов < form accept-charset ="ISO-8859-1"> action Обязательный атрибут, указывает  url  обработчика формы на сервере, которому передаются данные <form method="post" action="../admin/ add_story.php "> autocomplete Отвечает за запоминание введенных в текстовое поле значений и автоподстановку их при последующем вводе: on / off

Изображение слайда
6

Слайд 6

Атрибуты элемента <form> Атрибут Значение / описание enctype Используется для указания MIME-типа данных, отправляемых вместе с формой method Задает способ передачи данных формы. Метод  get  передает данные на сервер через адресную строку браузера www.anysite.ru/form.php?var1=1&var2=2 Метод  post  применяется для пересылки данных больших объемов, а также конфиденциальной информации и паролей.

Изображение слайда
7

Слайд 7

Атрибуты элемента <form> Атрибут Значение / описание name Задает имя формы, которое будет использоваться для доступа к элементам формы через сценарии target Указывает окно, в которое будет направлена информация

Изображение слайда
8

Слайд 8: Элементы формы

Изображение слайда
9

Слайд 9

Элемент <input> Служит для создания различного типа полей Атрибут Значение / описание accept Определяет тип файла, разрешенных для отправки на сервер alt Определяет альтернативный текст для изображений autocomplete Отвечает за запоминание введенных в текстовое поле значений и автоподстановку их при последующем вводе value Определяет текст, отображаемый на кнопке, в поле или связанный текст

Изображение слайда
10

Слайд 10

Элемент <input> Служит для создания различного типа полей autofocus Установка поля в фокус checked Атрибут проверяет, установлен ли флажок по умолчанию disabled Отключает возможность редактирования и копирования содержимого поля form Определяет одну или несколько форм, которым принадлежит данное поле формы.

Изображение слайда
11

Слайд 11

Элемент <input> Служит для создания различного типа полей height Устанавливает высоту поля формы типа width Позволяет задать ширину полей формы max Позволяет ограничить допустимый ввод числовых данных максимальным значением maxlength Атрибут задает максимальное количество символов, вводимых в поле min Позволяет ограничить допустимый ввод числовых данных минимальным значением

Изображение слайда
12

Слайд 12

Элемент <input> Служит для создания различного типа полей name Определяет имя, которое будет использоваться для доступа к элементу multiple Позволяет пользователю ввести несколько значений атрибутов placeholder Содержит текст, который отображается в поле ввода до заполнения readonly Не позволяет пользователю изменять значения элементов формы, выделение и копирование текста при этом доступно.

Изображение слайда
13

Слайд 13

Элемент <input> Служит для создания различного типа полей step Задает шаг для числовых значений size Задает видимую ширину поля в символах src Задает url изображения, используемого в качестве кнопки отправки данных формы

Изображение слайда
14

Слайд 14

Атрибут type тега <input> type = button – создает кнопку type = checkbox – создает флажок Информатика Математика type = color – генерирует палитры цветов type = date – позволяет вводить дату

Изображение слайда
15

Слайд 15

Атрибут type тега <input> type = datetime-local – позволяет вводить дату и время type = email – поле для ввода адреса электронной почты type = file – позволяет загружать файлы с компьютера пользователя type = hidden – скрывает элемент управления type = image – создает кнопку, позволяя вместо текста на кнопке вставить изображение интерфейса,

Изображение слайда
16

Слайд 16

Атрибут type тега <input> type = month – позволяет пользователю вводить год и номер месяца type = number – предназначено для ввода целочисленных значений type = password – создает текстовые поля для ввода пароля type = radio – создает переключатель type = range – позволит создать ползунок type = reset – создает кнопку, которая очищает поля формы от введенных пользователем данных

Изображение слайда
17

Слайд 17

Атрибут type тега <input> type = reset – создает кнопку, которая очищает поля формы от введенных пользователем данных type = submit – создает стандартную кнопку, активизируемую щелчком мыши type = text – создает однострочноем текстовое поле type = time – позволяет вводить время в 24-часовом формате по шаблону чч:мм

Изображение слайда
18

Слайд 18

Атрибут type тега <input> type = reset – создает кнопку, которая очищает поля формы от введенных пользователем данных type = submit – создает стандартную кнопку, активизируемую щелчком мыши type = text – создает однострочноем текстовое поле type = time – позволяет вводить время в 24-часовом формате по шаблону чч:мм

Изображение слайда
19

Слайд 19

Элемент <textarea > <textarea> ... </textarea> Используется для создания больших текстовых полей. cols – размеры по горизонтали; rows – размеры по вертикали.

Изображение слайда
20

Слайд 20

Раскрывающийся список В списке можно выбирать одно или несколько значений. < select атрибуты> < option атрибуты >Пункт 1</ option > < option атрибуты >Пункт 2</ option > </ select >

Изображение слайда
21

Слайд 21

Надписи к полям формы Надписи к элементам формы создаются с помощью элемента <label>...</label>.

Изображение слайда
22

Слайд 22

Кнопки < button>...</button> Внутрь элемента < button> можно поместить контент – текст или изображение.

Изображение слайда
23

Слайд 23

Тег <keygen> Теги <keygen> </keygen> используются для шифровки и расшифровки данных. Тег <output> Теги <output> </output> создают область для вывода работы скрипта.

Изображение слайда
24

Слайд 24

Тег <fieldset> Группирует желаемую часть формы Тег <legend> Устанавливает заголовок группы элементов формы < fieldset > < legend >Заголовок</ legend > ... </ fieldset >

Изображение слайда
25

Последний слайд презентации: Формы в HTML-документе. Элементы форм

Изображение слайда