Як зробити html форму

Відео: Форми CSS / Як створити форму в CSS3

Содержание

Відео: Форми css / Як створити форму в css3
Інструкція

Щоб організувати взаємодію сайту з відвідувачем в його сторінках треба передбачити можливості для введення інформації і відправки її на сервер. Для цього в мові опису веб-сторінок HTML (HyperText Markup Language - «мова розмітки гіпертексту») передбачений спеціальний набір тегів. Що це за теги і як, користуючись ними створити в сторінці вебформу для заповнення відвідувачем?

Вам знадобиться

Базове знання мови HTML

Інструкція

HTML-теги, які повідомляють браузеру, що в цьому місці сторінки необхідно відобразити форму і її елементи, розміщуються в коді між відкриває тегом lt; .formgt; і закриває lt; ./ formgt ;. Хто відкриває тег повинен містити обов`язкову інформацію - атрибути, повідомляють куди саме треба відправити інформацію з форми і яким методом потрібно це зробити. Крім того, якщо сторінка містить більше однієї форми, то кожна повинна мати власне ім`я. З урахуванням всього цього відкриває тег може виглядати так:

Після відкриваючого тега форми нам слід розмістити елементи форми, які більше підходять для введення користувачем потрібного типу даних. Такими елементами можуть бути: Текстове поле введення: Тут, як і у всіх інших тегах "input", атрибут "type" задає тип елемента, "name" - ім`я змінної, яке буде відправлено разом з введеними в це поле даними, а "value "- це значення за замовчуванням, яким буде заповнено тестове поле введення. --Поле введення пароля: - Поле для «мітки з галочкою»: Тут наявність атрибута "checked" означає, що за замовчуванням галочка там буде стояти .-- Група перемикачів, з яких потрібно вибрати тільки один:
Зверніть увагу - у всіх елементів групи має бути однакове ім`я (name), але різні значення (value). На сервер буде передано тільки одне значення - то, яке відзначить відвідувач або те, що було вибрано за замовчуванням (атрибутом checked) .-- Список, що випадає:Тут кожен тег "option" - рядок в списку, що випадає. Як і для групи перемикачів на сервер буде передано тільки одне значення з поля, вибраного відвідувачем, або обраного за замовчуванням (тут - атрибутом selected) .-- багаторядкова текстове поле:Атрибути "cols" і "rows" задають ширину (в знаках) і висоту (в рядках) поля для введення тексту .-- Приховане поле: Це поле не буде видно заповнює форму, але теж буде відправлено разом з іншими даними .-- Поле вибору файлу для відправки: Відправка файлу вимагає, щоб в відкриває форму тезі були додаткові атрибути. Як мінімум, слід додати тег "enctype". Наприклад, так:

У найпростішому варіанті html-код веб-форми в зборі може бути таким: Виглядати в браузері він буде так: