HTML5 для начинающих / Урок #13 - Создание HTML форм и полей для ввода
HTML-код
- Опубликовано: 5 июн 2024
- HTML содержит множество тегов для построения всевозможных веб-форм. За урок мы научимся создавать формы, прописывать внутри них различные поля и добавлять к этому всему атрибуты.
✅ Полезные ссылки:
✏️ Урок на сайте itProger: itproger.com/course/html/13
⏰ Тайм коды:
00:00 - Начало
00:17 - Создание тега «form»
02:46 - Создание подписи для поля - тег «label»
03:08 - Создание поля для вода информации
04:20 - Атрибуты для тега «input»
11:47 - Разные форматы «input» полей
20:43 - Создание кнопок в форме
24:21 - Завершение
✔ Сообщество программистов: itproger.com/
✔ -------------
Вступай в группу Вк - prog_life 🚀
Группа FaceBook - goo.gl/XW0aaP
Инстаграм itProger: / itproger_official
Instagram: / gosha_dudar
Telegram: t.me/itProger_official
Twitter - / goshadudar
- Уроки от #itProger 👨🏼💻
- Все уроки по хештегу #itprogerLessons
![TRASH or PASS! Eminem ( Houdini ) [REACTION!!!]](http://i.ytimg.com/vi/cB1WrZcMwMc/mqdefault.jpg)
Посмотреть атрибуты для определенного тега в VS-code, можно с помощью сочетания клавиш: ctrl + пробел
God bless you 🙂🙌
герой
От души
@@Ilham0._.0спасибо :)
@@alexandralexandr2997 можешь сказать что делать если изображение вставил в сайт,потом заходишь через телефон на свой сайт и изображение не показывает
@@Ilham0._.0 рад был бы подсказать, но я к сожалению не знаю, тут все индивидуально. Попробуй задать этот вопрос чату gpt, возможно он ответит на твой вопрос.
Все очень классно! Видео оч понятные и интересные, спасибо большое за такой контент
👍👍👍👍👍респект! Короткие но очень информативные уроки.
Спасибо!! Очень понятные и хорошие уроки!
0 дизлайков? Да ты крут!
Пересмотрел кучу уроков по web формам, но только благодаря вашему видео понял эту тему. Благодарю за проделанную работу
Огромное спасибо, для новичков главное доступность информации и не отбить желание учиться дальше, у вас это хорошо получается.
Думала всегда,что это кошмар сложно, но с вашими объяснениями все кристально понятно. Иногда мозг уже начинает медленее грузиться из-за большого потока информации,но я просто отматываю назад и смотрю до тех пор пока не смогу обработать. Огромное спасибо за то, что не просто рассказываете ,но и показываете как и что прописывать. Супер!!!!
Отличный урок,длинный,и по этому на фоне всех остальных в этом курсе-сложноватый,но благо у нас отличный спикер который все понятно объясняет,спасибо за урок
Большое вам спасибо, кажется тему с полями для ввода я выучил лучше других тем)
Информативный урок! Отлично!
Урок супер как и все остальные!!!
Нашёл только небольшую несостыковку на моменте 10:49, тут ты говоришь, что атрибут "for" работает с названием объекта, хотя на самом деле этот атрибут работает с id объекта
Я не разбираюсь, но разве id и название объекта не одно и тоже?
@@timirlanhaniev нет, id - идентификационный номер, название - название.
логика одна и та же, ты можешь обращаться как к идентификатору так и к имени. Сначала сам подумай, а потом делай замечания людямлогика
@@hattori-6751
А вот меня даже такая крохотная несостыковка сильно запутала:
Как одновременно и объединить все radio (для этого им нужно дать один name), и подключить к каждому radio свой label?
по словам автора, нужно к label добавить атрибут for, куда указать name, а как указать name, если один и тот же name присвоен нескольким radio?!?!
Надеюсь кто-нибудь понял мой высеp
@@Dmitry_Grachiev ты поймешь это во время обучения css , ну или в верстке первого макета
Отличные видео, информации много, нужно время все переварить 😁
Чудова подача, дякую!
Здорово!
Отличные уроки
Смотрю ваши уроки и понимаю, что программировать не сложно в целом =) (хотя очевидно, что дальше будет сложнее)
Спасибо за ваш труд!
HTML - текст гипертекстовой разметки, а программирование это уже C,C++,C#,Java,Js,Kotlin,Swift,Python.. терпения вам 😂
Очень Благодарен ! Спасибо !
Спасибо за урок
Спасибо вам большое за урок!!!
Воу видосы выходят так быстро респектос , уроки у тебя крутые ,жду жс )
Он заранее снимает, и загружает одновременно
для label for, там все таки id, а не name Введите имя
+
+
Можешь объяснить в чём разница пожалуйста?
@@JakeAdvenTime Значения id и name одинаковые, а так вроде не правильно
очень понятно все объяснено, спасибо!
спасибо огромное за классные уроки обожаю ваш канал👍👍👍👍👍👍
урок понятный и разборчивый !
Очень хороший урок
спасибо за урок
Красавчик ! Спасибо !
хороший курс 🙂🙃
На моменте 16:43 атрибут "datetime" не корректно работает, потому что нужно использовать "datetime-local", тогда появится окошко для выбора даты и времени (без часового пояса). Он поддерживается и в Эйдже и в Хроме
Блин очень классно все объясняешь )) Усынови меня и учи ))))
Спасибо
Merci!
классно
у меня reset не очищает поля (( почему?
Поправка: Забыл вписать :)
Добрый день, курс классный, спасибо!
Подскажите, можно ли в Notepad++ сделать автоподбор атрибутов (как у Вас, когда выскакивает список возможных атрибутов для этого тега)? Если нет, в каком редакторе это доступно? Windows
Спасибо!
Можете плагин Emmet установить для Notepad++
Спасибо, очень полезный курс. Подскажите, какой редактор (IDE) Вы используете? Как реализована "подсказка" списка атрибутов к тегу? Не могу настроить в VS Code
Atom, а в VS Code вы можете использовать сочетание клавиш Control+Space чтобы узнать все доступные атрибуты к тегу.
В vs code подсказки лучше сделаны
А можно примеры использования атрибута hidden? И disabled, зачем поле, в которое нельзя ввести?
к примеру: для работы с бэкендом очень важно присутствие поля id, а показывать пользователю нет необходимости
простооооо СУУУППЕЕРРРРР
Поправка про дату и время:
А что дает это "-local"?
Может часто задаваемый вопрос, но тем не менее, отступы играют какую-либо роль в языке или это просто для наглядности?
В HTML - это просто для наглядности
Как в ВС код посмотреть все возможные атрибуты для того или иного тега? ( внутри редактора)
Вы чутка ошиблись) в атрибуте for=" указывается назавние id", а не name=" "
Использую Egde как основной браузер и поверь он все читает )
type="color" легко
datatime-local кста на Эдже работает)))
ИИСУС ХРИСТОС ЕСТЬ МЕССИЯ И ОН ВОСКРЕС
привет,подскажи пожалуйста как вызывать подсказку тэгов как высвечивается на 6:35 ,и спасибо за уроки :)
Она должна быть автоматически в этом приложении
@@timirlanhaniev спасибо ,думаю установить другой редактор)
если у тебя не атом, то попробуй сочетание клавиш ctr+пробел
@@SAMANUELb спасибо))
Какими плагинами или способами программисты пользуются чтобы искать два одинаковых ID в коде? В уроке было сказано, что нельзя присваивать одинаковые ID в коде HTML. Ведь если код объемный, трудно запомнить все имена ID...
😊😊😊😊😊😊
переход так и не заработал, менял и name и id пробовал делать так же как в примере, результат один переход в поле не происходит результаты сохранял страницу обновлял, почему такое происходит?
Та же проблема(
Подскажите пожалуйста, пользуюсь атомом, не понимаю как блоки сворачивать, подскажите как это сделать пожалуйста
Добрый день. Как прописать свое название, которое будет указано внутри поля "Дата"? Вот пример:
Пробовал и атрибуты value и placeholder, не помогают....
Спасибо.
🙂
:)
Очень хорошее видео, но я прифигел после 5-ти минутных обучалок 25 минут смотреть. за 2 часа посмотрел)
хотел сделать, чтоб текст вводился по центру окна и прописал align='center' в input.... не проканало..)))
CSS свойство для этого есть, но CSS уже в следующем курсе :)
☦❤🙏💕☦💕❤🙏
чтобы было окошко с временем надо написать без date т.е просто time
Color в Edge работает.
Видеоролики интересные и полезные для начального изучения html, только очень напрягает произношение английских слов
@@maskwejlka3698 вот-же @xeither289 обрадуется когда ухнает что в комментариях сам боже сидит)
Не подскажете, у меня не работает ctrl+space. Не могу посмотреть теги к атрибуту инпут. Гуглил, ничего толкового не нашел
1 курс, для меня был понятнее , досмотрю этот, потом на 1 старый курс , перейду . =-(((
а почему сейчас не работают кнопку reset, sumbit и страница не перегружается?
а почему у тебя стоят аж два , если можно поставить и 1
2 строчка получается
1 делает маленький отступ
2 делают более большой отступ
БОГ ЕСТЬ ЛЮБИТЕ БОГА И СВОИХ БЛИЖНИХ
Поменяй аву чел
@@max_voronenkovобиженый ватничек за Россию ущемился от авы
А что это за среда разработки? Это не Visual Studio Code?
Atom
Почему-то не сработал. Когда пишу без "собачки", то ничего не выскакиевает, как на видео. Кто знает почему?
Проверь, чтоб элемент input был вложен в элемент form
datetime-local вместо datetime и все работает в хроме))
Спасибо! )
А как зделать фон неподвижним?
постараюсь обяснить: Нужно чтоби фон не проворачивался с текстом. Текст проварачивается а фон закреплен.
Ну объясняешь ты классно
У меня в атоме когда ввожу текст он ростягивается в одной строке в даль, как сделать так как у автора?
Наверное уже поздно, но вот в самом конце строки
Добрейшего! Кнопка reset вообще никак не реагирует, ничего не стирает ни в каких манипуляциях. В чем проблема?
Некоторые браузеры ее не поддерживают
@@itproger а есть ли что-нибудь универсальное для всех браузеров? Только танцы с бубнами? Большая форма, юзер задолбается стирать
Ну и нифига у меня не обновляется страничка. С кнопкой очистить та же история
@OnlyOne Спасибо
В EDGE все поддерживает
Ctrl + R - обновление страницы.
Так в чём собственно смысл тега form?
для , работает также, как для .
То есть некоторые поля для ввода могу не работать без
у меня ни в хроме ни в сафари не отображается ни календарь ни выбор цвета ...=(
Бывает
атрибут name це ніби якір?
Нет
Класс лайкни меня чтобы я стал хорошим программистом
Ну что? Как успехи?
мне тоже интересны успехи )
А зачем br дважды прописывать??
Чтобы отступ был побольше
взлетело когда for=id, а не name
8:27
Секс
Без обид но у тебя местами повторение одних и тех же слов,это увеличивает время урока,сократи объяснение,а так всё good,thx)
🤫🤫🤫
Он объясняет для новичков, и повторяется что бы ты запомнил
имба видосики уже 13 ролик посмотрел
спасибо за урок
Спасибо