Стилизуем форму тег select на CSS. Подробный урок от ВебКадеми

Поділитися
Вставка
  • Опубліковано 8 лис 2024
  • ↓↓↓ Макет и ссылка на материалы в описании под видео ↓↓↓
    В этом уроке стилизуем тег select на CSS. Урок по верстке HTML и CSS.
    Код с урока: webcademy.ru/f...
    Урок с полной стилизацией и кастомным селектом на JS:
    • Video
    Can I use:
    caniuse.com/?s...
    caniuse.com/?s...
    Nodelist forEach polyfill:
    developer.mozi...
    Автор урока: Юрий Ключевский
    Школа обучения веб-разработки ВебКадеми.рф
    ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
    💻 Бесплатный курс "Создай свой первый сайт на HTML5 и CSS3"
    От установки редактора, до публикации в сети.
    👉 Получить уроки, конспекты, макет и код из уроков: webcademy.ru/ht...
    ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
    💻 Курс по созданию и верстке сайтов: webcademy.ru/h...
    Обучение с наставником, 3 месяца, результат, гарантия.
    Научим создавать веб-сайты и зарабатывать на этом.
    Старт обучения: 18 Ноября 2024 года.
    💻 Курс "Frontend разработчик. JavaScript + React": webcademy.ru/j...
    Обучение с наставником, 3 месяца, результат, гарантия.
    Старт обучения: 25 Ноября 2024 года.
    💻 Курс "Разработка сайтов на PHP + MySQL":
    webcademy.ru/p...
    Создание сайтов с системой управления.
    Присоединиться к курсу можно прямо сейчас.
    🏁 Обучение с нуля
    💁‍♂️ Обучение с наставником
    🎯 Доведение с нуля до результата
    🏢 Помощь с трудоустройством
    💵 Поможем взять первый заказ на фрилансе
    💳 возможна рассрочка
    💳 если курс не понравится, вернём деньги в первую неделю
    ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
    💈 Сайт школы ВебКадеми: webcademy.ru/
    💈 Вступайте в группу Вконтакте: webcademy
    💈 Подписывайтесь на Telegram: t.me/webcademy...

КОМЕНТАРІ • 15

  • @ЯнаАлександровна-э7к

    Огромное спасибо! Замечательный код в приложении - просто мечта. Всё понятно и пояснено.

  • @norkss1
    @norkss1 8 місяців тому

    Супер, спасибо, мне помогло с кастомизацией это видео. Стоит отметить что без воды

  • @Дарья-у5т6п
    @Дарья-у5т6п 3 роки тому +2

    Спасибо! Все по делу и четко. Моя проблема (как раз баг с некликабельным треугольником) благодаря вашему видео решилась.

  • @Sergey_Klimov
    @Sergey_Klimov 3 роки тому +2

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

  • @ОлегСоколов-з6с
    @ОлегСоколов-з6с 3 роки тому +1

    вот спасибо, а то я не мог понять почему не получается сделать афтер селекту а оказывается потому-что, буду знать :)

  • @lesya-ukrainier
    @lesya-ukrainier 3 роки тому +2

    Очень крутое объяснение, спасибо, все получилось

  • @DevidWens
    @DevidWens 2 місяці тому

    Спасибо!

  • @uk-lych_sveta
    @uk-lych_sveta 2 роки тому +1

    Спасибо за дельный и понятный контент. Если есть возможность сделай пожалуйста урок по форме обратной связи от начала до конца с практическим применением. Заранее благодарю.

  • @beeprodaction9601
    @beeprodaction9601 Рік тому

    супер

  • @baytszy
    @baytszy 3 роки тому +3

    поподробней бы о созадании новых дивов...почему у select не получится создать стрелочку...

  • @walterwhite4407
    @walterwhite4407 13 днів тому

  • @AntonioBenderas
    @AntonioBenderas Рік тому +1

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

  • @dmitriyanatolev2518
    @dmitriyanatolev2518 2 роки тому

    Все сделал по инструкции,но псевдоелемента нет ,и подсветку включил красным цветом и обернул все как в инструкции ,и классы прописал ,но увы

  • @worzyk957
    @worzyk957 Рік тому

    Как зделать чтоб я переключался на другой сайт

  • @laQuys
    @laQuys Рік тому

    Очень прошу помогите, как изменить если он записан как
    ${HTML.select("id", [
    name: "1",
    value: "1",
    }, {
    name: "2",
    value: "2",
    }, ])}${HTML.newLine(1)}