Студопедия

Главная страница Случайная страница

Разделы сайта

АвтомобилиАстрономияБиологияГеографияДом и садДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеталлургияМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРелигияРиторикаСоциологияСпортСтроительствоТехнологияТуризмФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника






  • Сервис онлайн-записи на собственном Telegram-боте
    Тот, кто работает в сфере услуг, знает — без ведения записи клиентов никуда. Мало того, что нужно видеть свое расписание, но и напоминать клиентам о визитах тоже. Нашли самый бюджетный и оптимальный вариант: сервис VisitTime.
    Для новых пользователей первый месяц бесплатно.
    Чат-бот для мастеров и специалистов, который упрощает ведение записей:
    Сам записывает клиентов и напоминает им о визите;
    Персонализирует скидки, чаевые, кэшбэк и предоплаты;
    Увеличивает доходимость и помогает больше зарабатывать;
    Начать пользоваться сервисом
  • Створення і використання форм






    Форми — це фрагменти HTML-документа, що “відповідають” за введення інформації клієнтом. За допомогою HTML можна створювати як прості форми (пропонується вибрати одну або декілька відповідей), так і складні (для тестів, замовлень тощо). Форми розміщуються у контейнері < FORM> …< /FORM>. Даний тег повинен містити атрибут ACTION, який вказує на адресу серверного з¢ єднання та є обов¢ язковим. Найпростіша форма має таку структуру:

    < form action=" адреса серверного сценарію" >

    ....Різні елементи форми (серед них обов¢ язково присутній SUBMIT).....

    < /form>

    Елемент INPUT створює поле форми (кнопку, поле вводу, чекбокс тощо), він повинен розміщуватися всередині елемента FORM. Всі елементи форм створюються тегами, що мають початок: < input type=¢ ¢ …¢ ¢ >, де виставляється значення атрибута TYPE і визначається тип елемента. Можливі такі значення цього атрибута:

    TEXT (текстове поле) — створює поле вводу для одного рядка тексту;

    < input type=¢ ¢ text¢ ¢ name=¢ ¢ ім¢ я поля¢ ¢ valur=¢ ¢ початковий текст¢ ¢ align=¢ ¢ LEFT¢ ¢ size=¢ ¢ число символів¢ ¢ maxlength=¢ ¢ максимальне число символів¢ ¢ >

    Наприклад:

    < INPUT NAME = " FIO" VALUE=" Іванов Іван Іванович " ALIGN=" CENTER" SIZE=" 23" MAXLENGTH=" 30" >

    TEXTAREA ( текстова область ) — створює поле для вводу декількох рядків тексту. Цей елемент повинен розміщуватися всередині блоку FORM.

    < textarea name=" ім¢ я" cols=" число стовпців" rows=" число строчок" wrap=" спосіб переносу строчок" > текст, розміщений у текстовій області < /textarea>

    Наприклад:

    < FORM>

    < TEXTAREA NAME=" address" WRAP=" virtual" COLS=" 40" ROWS=" 3" >

    Ваша адреса...

    < /TEXTAREA>

    < /FORM>

    SELECT (поле списку) — дозволяє створити вибір одного пункту або багатьох пунктів із заданого списку. При цьому елемент OPTION описує окремі пункти меню. Структура HTML- коду, що визначає поле списку, така:

    < select name=" ім¢ я списку" size=" число видимих опцій" multiple>
    < option value=" значення" selected> текст
    < option value=" значення" > текст
    ...... і так далі......
    < option value=" значення" > текст
    < option value=" значення" > текст
    < /select>

    Наприклад:

    < select name=" week" size=" 7" >

    < option value=" 1" > Понеділок< /option>

    < option value=" 2" > Вівторок< /option>

    < option value=" 3" > Середа< /option>

    < option value=" 4" > Четвер< /option>

    < option value=" 5" > П¢ ятниця< /option>

    < option value=" 6" > Субота< /option>

    < option value=" 7" > Неділя< /option>

    < /select>

    CHECKBOX (прапорець) — створює поле вводу для типу Boolean (так/ні)

    < input type=" Checkbox" name=" ім¢ я прапорця" value=" значення" checked> текст, який, як правило, розміщують поряд із прапорцем

    Наприклад:

    Вкажіть Ваші навички: < BR>

    < input type=" checkbox" name=" skill" value=" 1" checked> HTML< BR>

    < input type=" checkbox" name=" skill" value=" 2" > JavaScript< BR>

    < input type=" checkbox" name=" skill" value=" 3" > Perl< BR>

    < input type=" checkbox" name=" skill" value=" 4" > XML< BR>

    < input type=" checkbox" name=" skill" value=" 5" > FLASH< BR>

    RADIOBUTTON (радіокнопка) — створює поле вводу для атрибутів, що приймають значення одне із декількох можливих. Радіокнопка створюється за допомогою коду:

    < input type=" radio" name=" ім¢ я радіокнопки" value=" значення" checked> текст, який, як правило, розміщують поряд із радіокнопкою

    Часто використовують декілька радіокнопок, наприклад:

    Вкажіть Ваші навички: < BR>

    < input type=" radio" name=" skill" value=" 1" checked> HTML< BR>

    < input type=" radio" name=" skill" value=" 2" > JavaScript< BR>

    < input type=" radio" name=" skill" value=" 3" > Perl< BR>

    < input type=" radio" name=" skill" value=" 4" > XML< BR>

    < input type=" radio" name=" skill" value=" 5" > FLASH< BR>

    BUTTON (кнопка) — створення кнопок. Код має такий вигляд:

    < input type=" submit" name=" ім¢ я кнопки" value=" надпис на кнопці " >

    Наприклад:

    < input type=" submit" name=" subm" value=" Відправити дані " >

    Щоб передбачити можливість скидання усіх введених користувачем даних, використовується кнопка reset.

    Наприклад:

    < INPUT NAME = " FIO" VALUE=" Іванов Іван Іванович " ALIGN=" CENTER" SIZE=" 23" MAXLENGTH=" 30" >

    < BR>

    < TEXTAREA NAME=" address" WRAP=" virtual" COLS=" 30" ROWS=" 3" >

    Ваша адреса...

    < /TEXTAREA>

    < BR>

    < input type=" reset" name=" name" value=" ВІДМІНИТИ ВВЕДЕННЯ" >

    Поряд із кнопками submit та reset використовуються ¢ ¢ звичайні¢ ¢ кнопки, з якими пов¢ язують ту чи іншу дію:

    < input type=" button" name=" ім¢ я кнопки" value=" надпис на кнопці" onclick=" дія, що пов¢ язана з кнопкою " >

    Наприклад:

    < input type=" button" value=" Показати сьогоднішнє число" onclick=" alert(Date()); " >

    PASSWORD (приховування змісту тексту) – створює поле вводу для одного рядка тексту, однак текст відображається у вигляді знака ¢ ¢ *¢ ¢:

    < input type=" password" value=" значення за замовчуванням" size=" довжина поля (у символах)" maxlength=" максимальна допустима кількість введених символів " >

    Наприклад:

    < input type=" password" value=" 123456" size=" 6" maxlength=" 8" >

    FILE (прикріплення файлів) — дозволяє користувачу прикріпити файл і відправити його на сервер разом із змістом текстових полів та інших елементів форми. Багато існує сайтів, де передбачено реєстрацію користувачів, а також відправку фото, текстових файлів із резюме, файлів із текстами статей та ін.

    < input type=" file" name=" ім¢ я елемента" size=" довжина адресного поля у символах" accept=" допустимий тип файла " >

    Наприклад:

    < input type=¢ ¢ file¢ ¢ size=¢ ¢ 50¢ ¢ >

    Завдання 1. Створити форму.

    < HTML>

    < HEAD>

    < TITLE> Навчальний файл HTML< /TITLE>

    < meta http-equiv=" Content-Type" content=" text/html; charset=UTF-8" >

    < /HEAD>

    < BODY>

    < form method=" post" action=" mailto: kis@ngasu.nsk.su? subject=Information" >

    < pre> Ваше ім¢ я: < input name=" name" type=" text" maxlength=" 40" size=" 40" value=" " >

    Ваша стать: < input type=" radio" name=" pol" value=" male" > Чоловіча

    < input type=" radio" name=" pol" value=" female" > Жіноча

    На якому курсі Ви навчаєтесь? < select name=" curs" size=" 1" >

    < option value=" 1" selected> Перший < /option>

    < option value=" 2" > Другий< /option>

    < option value=" 3" > Третій< /option>

    < option value=" 4" > Четвертий< /option>

    < option value=" 5" > П¢ ятий < /option>

    < /select>

    Які мови програмування Ви знаєте?

    < input type=" checkbox" name=" pascal" value=" yes" checked> Паскаль

    < input type=" checkbox" name=" c" value=" yes" > Сі

    < input type=" checkbox" name=" asm" value=" yes" > Асемблер

    Напишіть декілька слів про себе: < /pre>

    < textarea name=" about" rows=" 6" cols=" 60" wrap=" off" > < /textarea>

    < p> < input type=" submit" value=" Відіслати дані " >

    < input type=" reset" value=" Очистити форму " >

    < /form>

    < /BODY>

    < /HTML>






    © 2023 :: MyLektsii.ru :: Мои Лекции
    Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав.
    Копирование текстов разрешено только с указанием индексируемой ссылки на источник.