Задачи по HTML и CSS. Задача 13. "Запись на курсы"

Задачи по HTML и CSS

верстка

список всех задач

Задача 13. "Запись на курсы"

Условие: Создайте html-файл, результат которого показан на рисунке. При клике на кнопку 'Очистить' поля формы обновляются, на кнопку 'Отправить' - происходит отправка данных на сервер методом POST.

задачи html

Устали? Отдохните с пользой



Смотрите:

  1. Задачи по HTML и CSS. Задача 4. "Проект"
  2. Задачи по HTML и CSS. "Пагинация"
  3. Задачи по HTML и CSS. "Inteface"
  4. Задачи по HTML и CSS. "Front-end developer"

Комментариев 22 к “Задачи по HTML и CSS. Задача 13. "Запись на курсы"”

  3. https://codepen.io/Greshnic/pen/PNMKWo?editors=1000

    Есть пару вопросов:
    1) Почему при отправке формы кодировка заполненных полей сбивается, если заполнять кириллицей? Установка атрибута формы accept-charset = utf-8 или windows-1251 не помогает.
    2) Можно ли в тег p вкладывать теги label и input, как я сделал с "Язык программирования:"? Тогда можно было бы не пользоваться тегом br для разбивки формы на отдельные части. Да и не знал я, во что ещё обернуть этот "Язык программирования:", т.к. если в label, то при нажатии на эту надпись сразу выбирается первый пункт с С++, а это некорректно будет.

  4. 1) не понял вопрос
    2) тег p не подходит, так как он для текста по смыслу. можете проверить на валидаторе
    это задачи для чистого html для начинающих с 0, поэтому не сильно вникайте в такие детали. вот в связке html+css такие вопросы стоит разбирать

  5. 1) В форме, которая по моей ссылке, заполните любыми русскими буквами поля "Имя", "Дополнительная информация" и "Секретное слово" и нажмите "Отправить". Вылезет окно почтового клиента (т.к. я указывал action="mailto:", но не суть) и там всё, что вы написали русскими буквами, будет в абракадабре. Почему так? Что-то с кодировкой...

    2) Во что нужно обернуть "Язык программирования:", чтобы было правильно?

    P.S. Было бы неплохо, если бы вы публиковали ответы на эти задачки, было бы с чем сверяться)

  6. Касаемо пункта "2) Можно ли в тег p вкладывать теги label и input" - гугл говорит, что в HTML5 можно. Во всяком случае в учебниках с примерами так делают...

    https://books.google.by/books?id=KM4eBQAAQBAJ&pg=PA129&lpg=PA129&dq=%D0%BC%D0%BE%D0%B6%D0%BD%D0%BE+%D0%BB%D0%B8+label+input+%D0%B2%D0%BA%D0%BB%D0%B0%D0%B4%D1%8B%D0%B2%D0%B0%D1%82%D1%8C+%D0%B2+p&source=bl&ots=vuOoC3fiBF&sig=6xTdcG3QQ2Y2h7O2mEbctSM2bVs&hl=ru&sa=X&ved=0ahUKEwiTldT2t_DMAhXiAJoKHZ_2C1wQ6AEIIjAB#v=onepage&q=%D0%BC%D0%BE%D0%B6%D0%BD%D0%BE%20%D0%BB%D0%B8%20label%20input%20%D0%B2%D0%BA%D0%BB%D0%B0%D0%B4%D1%8B%D0%B2%D0%B0%D1%82%D1%8C%20%D0%B2%20p&f=false - в конце страницы 129 в примере так.

  7. вкладывайте. я так не делаю. тег p для разбивки текста. по документации w3org тег p может содержать phrasing elements, среди которых и input, и label. но не обязан. ориентир по верстке форм http://getbootstrap.com/css/#forms вместо p создавайте обертку со стилями. думаю, вы сами все знаете

  8. https://jsfiddle.net/moloko/ousjm4rz/

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

  9. что то не так с моим решением? я вроде оставлял комментарий.

  11. кнопка Очистить не работает. Ширина textarea меньше. И банальная опечатка в тексте - так нельзя))

  12. Блиииин) я точно делал кнопку сброса. наверно не сохранил) текст поправил, невнимательность, что да то да. а что касаемо ширины поля, то мне кажется в самый раз. вот, задал текст по умолчанию, по моему с образцом совпадает. 25 уже будет мало, может в оригинале 28?) но это совсем рядом.
    https://jsfiddle.net/moloko/ousjm4rz/5/

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *