12. HTML тег input и его вариации. Атрибут type, значения tel, email, password, url, search и другие

Поделиться
HTML-код
  • Опубликовано: 7 сен 2024

Комментарии • 43

  • @AleksanderLamkov
    @AleksanderLamkov  Год назад +19

    Забыл упомянуть ещё один тип для поля ввода:
    - визуально скрывает элемент со страницы.
    Используется зачастую для передачи каких-то мета-данных (токен, id товара) при отправке формы.
    Подробнее, наверное, вам пока знать не обязательно, но если столкнетесь с ним, то общее представление у вас будет :)
    Вот тут чуть подробнее:
    developer.mozilla.org/ru/docs/Web/HTML/Element/input/hidden

    • @ukraine1514
      @ukraine1514 4 месяца назад

      Почитаем, спасибо 👍😁

  • @Мальчик_Ананас
    @Мальчик_Ананас 21 день назад +2

    Кратко и понятно. А также курсы новые, что очень радует

  • @BezhovHF
    @BezhovHF 5 месяцев назад +7

    Лучшие плейлист для повторения, убирает все вопросы, спасибо огромное

  • @Pon-Pon-Patapon
    @Pon-Pon-Patapon Год назад +4

    Спасибо, очень интересно.

  • @ilya10rus
    @ilya10rus 6 месяцев назад +3

    Спасибо, за вашу работу! 😊

  • @silenciomar
    @silenciomar 7 месяцев назад

    Благодарю за урок! Поражает то, как кратко и информативно вы донесли информацию.

  • @VadimKapustin
    @VadimKapustin Год назад +4

    Спасибо за видео, отличная подача и текст! Мне кажется ambient не лучший выбор для познавательного контента, даже наоборот, мешает воспринимать информацию и усыпляет (Не совет, а обратная связь)

  • @alexb.2616
    @alexb.2616 Год назад +1

    Пять баллов!

  • @user-wn8ni9jh8y
    @user-wn8ni9jh8y 5 месяцев назад +2

    Александр, спасибо за все видео-уроки! Подскажи, пожалуйста, где можно взять макеты, набить руку, верстая сайты, как-то самому тяжело приходит идея/макет, чтобы с нуля начать так писать, легче по макету пока будет. может есть проверенные источники для практики html + css

    • @AleksanderLamkov
      @AleksanderLamkov  5 месяцев назад +1

      Привет! Спасибо за фидбек :) Макеты можно найти в телеграмм-каналах: t.me/maketforfigma, t.me/figma2html и могу предложить такой макет с примерным ТЗ: boosty.to/friendly-frontend/posts/f7550e28-5d82-4594-b99a-48055cb790cc?share=ios_post_link

    • @user-wn8ni9jh8y
      @user-wn8ni9jh8y 5 месяцев назад

      Благодарю) еще вопрос, в сложных для себя ситуациях, обращаться лучше к гугл и различным там источникам или можно практиковать с chat-gpt?@@AleksanderLamkov

    • @AleksanderLamkov
      @AleksanderLamkov  5 месяцев назад +1

      ChatGPT классная вещь, но нужно перепроверять, что она выдает, а не бездумно всё копипастить :)
      Ну а так, лучше совмещать все способы поиска информации.

  • @evgenyyakushenko4636
    @evgenyyakushenko4636 Год назад +2

    Вроде все же можно стилизовать с помощью нестандартных псевдоэлементов типа ::-webkit-slider-thumb, ::-webkit-slider-runnable-track и прочих с разными вендорными префиксами

    • @AleksanderLamkov
      @AleksanderLamkov  Год назад +3

      Хм, не знал. Спасибо!
      Нашел такое: css-tricks.com/styling-cross-browser-compatible-range-inputs-css/
      Вообще, мне в работе всегда приходилось делать кастомные range-слайдеры с двумя ползунками (а-ля мин-макс цена) и к сожалению, дефолтный type="range" с этим не справляется до сих пор...

  • @user-ms8wz6bc5e
    @user-ms8wz6bc5e 3 месяца назад

    Подскажите пожалуйста, какой атрибут (наподобие атрибута selected для ) использовать для тега (или "checkbox"), чтобы, один из двух предложенных вариантов, был изначально выбран, после загрузки страницы .Спасибо

  • @sabyrka
    @sabyrka 2 месяца назад

    Привет, зачем для input с type checkbox указывать атрибут name если данные отправляются с атрибута value чтобы сервер после отправки формы распознал выбор пользователя?

    • @AleksanderLamkov
      @AleksanderLamkov  2 месяца назад

      Привет! Без name у input сервер не увидит данные из value.
      Данные из формы с таким полем:
      Отправятся в виде:
      {
      "password": "qwerty"
      }
      Без name сервер не сможет понять, к какому свойству отправляемого объекта относится значение из value.

  • @user-hl9ms6dg8n
    @user-hl9ms6dg8n Месяц назад

    А для чего может понадобиться громкость звука?

    • @AleksanderLamkov
      @AleksanderLamkov  Месяц назад

      Чтобы реализовать кастомный плеер со своим регулятором громкости.

  • @DrazBit
    @DrazBit 2 месяца назад

    А точно нельзя стилизовать календарь через css ? Вроде можно

    • @AleksanderLamkov
      @AleksanderLamkov  2 месяца назад

      Только поле ввода. Выпадающий поверх страницы интерфейс календаря - нет. Он в каждом браузере свой.

  • @user-ml6ke7bu9v
    @user-ml6ke7bu9v 6 месяцев назад

    А у тебя случайно нет текстовых файлов всей инфы? Хочу для себя в Notion хранить)

    • @AleksanderLamkov
      @AleksanderLamkov  6 месяцев назад +2

      Увы. Лишь в формате сценариев без кода. В статьи переводить будет тяжко.
      Когда-нибудь выйдет обновленный курс, быть может сделаю и полноценную текстовую версию. Получится прям как полноценный онлайн-учебник...

  • @Renegade11111
    @Renegade11111 4 месяца назад

    С каждым видео музыка все громче и громче. Контент - заебись, но зачем делать музыку, чтоб тебя было еле слышно - загадка)

    • @AleksanderLamkov
      @AleksanderLamkov  4 месяца назад +2

      Согласен с негодованием. Но видео, которые ты сейчас смотришь, я записывал почти год назад. В целом подход к наличию музыки в видео я пересмотрел уже к середине курса по HTML, так что потерпи чуток, скоро эти неудобства исчезнут :)

  • @zhaslanulysabyrzhan
    @zhaslanulysabyrzhan 9 месяцев назад

    оборачивать чекбоксы с лейблом в параграф это что-то из разряда "бест практис"?

    • @AleksanderLamkov
      @AleksanderLamkov  9 месяцев назад +1

      Привет! Не только чекбоксы, а в принципе любые поля ввода (input, textarea, select). Так рекомендует W3C: html.spec.whatwg.org/multipage/forms.html#writing-a-form's-user-interface

    • @zhaslanulysabyrzhan
      @zhaslanulysabyrzhan 9 месяцев назад +1

      @@AleksanderLamkov Спасибо

    • @AleksanderLamkov
      @AleksanderLamkov  9 месяцев назад +1

      Пранализировал этот вопрос подробнее.
      Все же оборачивание в параграф не имеет большого смысла.
      Если разметка поля ввода сложная и внутри параграфа используется div (а так бывает часто), то такая разметка будет невалидной: caninclude.glitch.me/caninclude?child=Div&parent=P
      Скорее всего в том примере w3c параграфы используются сугубо для визуала.
      В общем, лучше оборачивать в , а не в .

    • @zhaslanulysabyrzhan
      @zhaslanulysabyrzhan 9 месяцев назад +1

      @@AleksanderLamkovспасибо за ответ

  • @dimitridoroshko
    @dimitridoroshko Год назад +1

    Какая у вас IDE? Webstorm?

    • @AleksanderLamkov
      @AleksanderLamkov  Год назад +2

      Угу, WebStorm.

    • @dimitridoroshko
      @dimitridoroshko Год назад +2

      @@AleksanderLamkov крутая IDE, это да :)

    • @dimitridoroshko
      @dimitridoroshko Год назад +2

      @@AleksanderLamkov а чем вам VScode не понравился? Там же плагинами можно все хорошо дополнить и +- тот же вебшторм только легче

    • @AleksanderLamkov
      @AleksanderLamkov  Год назад +2

      ​@@dimitridoroshko на самом деле много чем.
      Как минимум жутко неудобный поиск по файлам и коду проекта. Плюс боль с FTP / SFTP плагинами для ремоут-подключения к серверу в VSCode - в начале карьеры они меня здорово подставили, т. к. по-тихому умерли, а всякие альтернативы были одна мертвее другой.
      Настраивать всё плагинами - это надеятся на то, что они при автоапдейте не умрут.
      В WebStorm же "изкоробки" есть всё то, что нужно для более серьёзной разработки.
      Ну и также, если чего-то не хватает, можно накинуть плагинов.
      А про "легкость" IDE - этот фактор для меня перестал существовать, как только обновил рабочие железяки. Что VSC, что WS, запускаются и работают одинаково шустро.

    • @dimitridoroshko
      @dimitridoroshko Год назад

      @@AleksanderLamkov какие у вас характеристики рабочего компьютера / ноута?

  • @Ivanfwit
    @Ivanfwit Год назад +1

    жаль нельзя стилизовать большинство типов инпутов