я недавно начал изучать веб разработку смотрю разные уроки читаю книги но подача учебного материала лучшего чем у тебя я еще не встречал спасибо тебе за это
::before по правилам следует писать с двумя двоеточиями. Если применяешь position: absolute, то задавать display: block уже не нужно. Выравнивание .checkbox__label:after по центру, используя top и left в пикселях, не совсем рационально, потому что, если понадобиться поменять размер чекбокса, то придётся заново менять и эти значения. Здесь выравнивание можно сделать более универсальным.
Есть такое понятие как версии HTML, так вот для новеньких советую почитать и понять, что написание в формате ::before было в 4 версии, а вот в HTML 5 можно писать уже с одним двоеточием
Благодарю за урок. У меня появился такой вопрос, возможно ли стилизовать input type="date" ? Если возможно, то был бы рад увидеть видео урок от вас по этой теме.
Добрый день. Очень круто! Спасибо! Вопрос, может глупый, но все-же - данные из кастомного селекта из батона будут улитать на сервер при отправке формы?
Большое спасибо, очень доходчиво и понятно! Вопрос. После выбора одного из элементов выпадающего списка цвет и толщина границы меняются на стандартные. Только после последующего взаимодействия с любым другим элементом страницы цвет и толщина границы списка возвращаются к установленным в .select select. Почему так и как можно победить?
Уроки очень даже зачетные, про такие нюансы стилизации мало кто рассказывает, только вот не хватает других элементов формы (range, file, num, date) и т.д., для полной стилизации+функционала вы используете готовые jquery/js плагины или делаете своими силами?
Привет! Помогите определиться, я хочу начать изучение Бэкенда, примерно знаю что учить, mysql, php... Но ее знаю с чего начать, в какой последовательности учить, и сколько уйдет на освоение базовых навыков бэкенда времени, могу ли я после получение базы идти брать заказы на фриланс? Вообщем суть вопроса такова: что учить, в какой последовательности, и сколько время уйдёт, и через сколько можно пробовать брать работу?
А вот мне как раз думается, что стилизация select>options очень важна и интересна, потому что стандартная убого выглядит. Благо на codepen есть готовые решения.
Пишу код на React, никогда не требовалось убирать рамку у select, но потребовалось, тонну информации перебрал и нашёл ваше видео, но увы у меня не работает 😒
я уже хотел ставить диз, но тут в самом конце, ты сказал именно то зачем я вообще залез сегодня в интернет, клик по стрелке и стилизация того блока который выпадает, теперь я точно знаю, что через селект его невозможно стилизовать, теперь нужно найти как это сделать. Но лайк и за это, большинство на эту тему просто показывают мне тег селект и его атрибуты, буд-то бы я не могу загуглить и почитать это в статье. К сожалению, список без стилизированого выпадающего меню вообще нонсенс без этого нет смысла показывать эту тему
label с аттрибутом for - это зло. Потенциально (с вероятностью 90%), при копипасте на очередную форму возникнет ситуация, когда в html будут повторяться id элементов input, что приведёт к тому, что форма ввода будет работать не корректно.
Глупость написали. Бездумно копипастить код - это зло. А label с атрибутом for это правильная работа для связки элементов форм с их ярлыками, а так же очень полезно для создания сайтов, которые будут хорошо читаться для скринридеров, что позволяет людям с ограниченными возможностями использовать ваш сайт более удобно.
@@BrainsCloud Правильная работа для связки элементов - это вложить input внутрь label - и компонент получается ограничен одним контейнером (label) и аттрибут for не нужен, и стили легко писать и никаких проблем при копировании вёрстки.
@@BrainsCloud Прочитал. Написано: "A can be associated with a control either by placing the control element inside the element, or by using the for attribute." Где тут про "ненужный костыль"? Я уже 10 лет верстаю, и для меня как раз аттрибут for - это ненужный костыль..
Egor Nikolaev если помещать туда ещё и текст, который относится к элементу формы то да, а то что вы сначала написали оборачивать input в label - в этом я не вижу никакого смысла
0:00 - Стилизация чекбокса,
9:39 - Стилизация радио кнопки,
16:00 - Стилизация селекта.
Лайк, чтобы выбить в топ!
Дякую
Спасибо тебе огромное за стилизацию select, ты спас мои сроки)
Отличное видео.Подробно,понятно,неторопливо-то,что и требуется для новичков наподобии меня.Низкий поклон тебе добрый человек.Лайк безоговорочно.
я недавно начал изучать веб разработку смотрю разные уроки читаю книги но подача учебного материала лучшего чем у тебя я еще не встречал спасибо тебе за это
Слава Туркменским разработчикам!🇹🇲
Какой же клёвый видос, все очень понятно и без лишних слов, спасибо большое!
Огромное вам спасибо. Очень долго пытался разобраться, как все это делать) После вашего объяснения 5 минут и всё)))
Спасибо за очень полезный и понятный урок!
Очень информативно и приятно смотреть) Спасибо за урок.
Пожалуйста!
Отличный урок !!! Лучшие курсы наверное в рунете
Огромное спасибо. Отличная подача!
Очень интересный урок! Реально круто, как в пару строк кода обновить обыденные елементы страницы.
Огромное человеческое спасибо!
Спасибо за стилизацию checkbox ÷ У меня получилось с первого раза
::before по правилам следует писать с двумя двоеточиями.
Если применяешь position: absolute, то задавать display: block уже не нужно.
Выравнивание .checkbox__label:after по центру, используя top и left в пикселях, не совсем рационально, потому что, если понадобиться поменять размер чекбокса, то придётся заново менять и эти значения. Здесь выравнивание можно сделать более универсальным.
:before можно писать и с один двоеточием
Остальное - дело каждого
Есть такое понятие как версии HTML, так вот для новеньких советую почитать и понять, что написание в формате ::before было в 4 версии, а вот в HTML 5 можно писать уже с одним двоеточием
@@OleksandrPohribnyi Нет
@@BearVodkaAndValenki что нет, если да) в новых версиях без разницы, да и на видосе работает, поэтому безпонтовая придирка к автору)
спасибо! объясняешь классно, продолжай, пожалуйста, снимать!
Спасибо за урок, продолжай в том же духе!
Отличный урок, благодарю
Ох, реально понятно и круто, спасибо!!
Спасибо, добил дз по аналогии)
Спасибо. Интересно
будет интересно посмотреть видео про свойства appearance
Спасибо! Если можешь разбери эффект исчезновения как в Мстителях когда люди испарялись
Было бы круто еще увидеть видео по стилизации стрелок в теге input )
за одного такого фича - CSS triangle generator..... тебе большое спасибо
круто! Спасибо!
Спасибо! Очень помогли.
Спасибо!
Топовый видос!
Это супер!
Благодарю за урок.
У меня появился такой вопрос, возможно ли стилизовать input type="date" ?
Если возможно, то был бы рад увидеть видео урок от вас по этой теме.
Приехал с командировки и увидел в почте новые видосы.. Класс супер!! Так держать!! Дима можешь снять ролик по Less или Sass?
буду благодарен.
спасибо ты мне помог
Пробую сделать, как через классы, так и на прямую обратиться к элементу imput[type=checkbox], просто не меняются стили для after и before
Спасибо огромное, то что надо!
Полезное видео
Очень полезный урок! Вы помогли мне во многом. Особенно с селектом!
крутое видео!
Добрый день. Очень круто! Спасибо! Вопрос, может глупый, но все-же - данные из кастомного селекта из батона будут улитать на сервер при отправке формы?
В этом способе используются обычные селекты и данные будут отправляться без проблем
Спасибо, ты топ) накручиваю просмотры, уже раз 5 возвращался, чтобы сделать себе различные инпуты!
пахнет комфортом
Что за плагин, который при клике в браузере, маркирует код написаный в редакторе кода brackets и наоборот? Есть такая связь в VS Code? Спасибо!
Подскажите что у вас за плагин, который чертит пунктирной линией отступы?
по-моему это сам редактор Brackets по умолчанию делает в live режиме
Большое спасибо, очень доходчиво и понятно!
Вопрос. После выбора одного из элементов выпадающего списка цвет и толщина границы меняются на стандартные. Только после последующего взаимодействия с любым другим элементом страницы цвет и толщина границы списка возвращаются к установленным в .select select. Почему так и как можно победить?
аху..... это так годно
Так мало просмотров, аж грустно(((
это точно
Уроки очень даже зачетные, про такие нюансы стилизации мало кто рассказывает, только вот не хватает других элементов формы (range, file, num, date) и т.д., для полной стилизации+функционала вы используете готовые jquery/js плагины или делаете своими силами?
range, file можно тоже стилизовать используя css. Для выборы даты и времени - плагины.
Сделал в точности как в видосе,но почему то при нажатии на label ничего не происходит с checkboxom,с чем это может быть связано?
как выравнять слова относительно радиуса, ведь они прижаты как бы к верху?
Селекты понятно, а options? Видео хорошее, спасибо )
через css никак
Нужно всю логику элементов прописывать в Js, тогда можно кастомизировать стили всех элементов в select
А как достучаться до оption чтобы хотя бы hover повесить
А как, как сделать, чтобы фон выпадающего списка Select был не белый, а такой же, как фон страницы?
Чтобы он не выделялся белым пятном?
Подскажите почему у меня текст внутри лэйбла очень странно себя ведёт,он не располагается по длине коробки,а как-то сам рандомно переносится
Такой вариант стилизаций если использовать таб для перемещения по странице получает фокус?
да
спс
Привет!
Помогите определиться, я хочу начать изучение Бэкенда, примерно знаю что учить, mysql, php... Но ее знаю с чего начать, в какой последовательности учить, и сколько уйдет на освоение базовых навыков бэкенда времени, могу ли я после получение базы идти брать заказы на фриланс? Вообщем суть вопроса такова: что учить, в какой последовательности, и сколько время уйдёт, и через сколько можно пробовать брать работу?
Бери и пробуй делать то, что пишут в заказах на фрилансе. Отсюда получишь ответы на свои вопросы.
а можно ли таким способом при нажатии на чекбокса менять например цвет фона у блока в котором они все находятся?
Антон Теньшаков через js
свойство appearance вроде еще эксперементальный вариант. Почему не использовать display: none; ?
и не надо будет писать position
Это сделает его невидимым для скринридеров, но в целом если думать только об обычных пользователях, тогда тоже как вариант.
А вот мне как раз думается, что стилизация select>options очень важна и интересна, потому что стандартная убого выглядит. Благо на codepen есть готовые решения.
Почему во всех подобных уроках не рекомендуют скрывать главный чекбокс через display: none ?
а что это за плагин для редактора кода, что открывает окошко выбора цвета прямо в редакторе?
Иван Фадеев ctrl + e в brackets
Пишу код на React, никогда не требовалось убирать рамку у select, но потребовалось, тонну информации перебрал и нашёл ваше видео, но увы у меня не работает 😒
Спасибо! Даже "Сруслищ" - не испортил видос
Triаrius Tenax что за сруслищ?))
1:57
Как ты так сделал, что без обновления страницы всё отображается в браузере?
live preview в brackets
А выпадающий список в селекте тоже надо стилизовать
я никак не могу обратится к родителю в scss помогите !!!
я уже хотел ставить диз, но тут в самом конце, ты сказал именно то зачем я вообще залез сегодня в интернет, клик по стрелке и стилизация того блока который выпадает, теперь я точно знаю, что через селект его невозможно стилизовать, теперь нужно найти как это сделать. Но лайк и за это, большинство на эту тему просто показывают мне тег селект и его атрибуты, буд-то бы я не могу загуглить и почитать это в статье. К сожалению, список без стилизированого выпадающего меню вообще нонсенс без этого нет смысла показывать эту тему
это css3 чистый?
Всё классно конечно, я лайк поставил, но выпадающий список режет глаз.
не сработало у меня с checkbox:(
+
1 кнопка срабатывает а другие нет :(
label с аттрибутом for - это зло. Потенциально (с вероятностью 90%), при копипасте на очередную форму возникнет ситуация, когда в html будут повторяться id элементов input, что приведёт к тому, что форма ввода будет работать не корректно.
Глупость написали. Бездумно копипастить код - это зло. А label с атрибутом for это правильная работа для связки элементов форм с их ярлыками, а так же очень полезно для создания сайтов, которые будут хорошо читаться для скринридеров, что позволяет людям с ограниченными возможностями использовать ваш сайт более удобно.
@@BrainsCloud Правильная работа для связки элементов - это вложить input внутрь label - и компонент получается ограничен одним контейнером (label) и аттрибут for не нужен, и стили легко писать и никаких проблем при копировании вёрстки.
Egor Nikolaev почитайте для чего нужен тег label, а то что вы написали это ненужный костыль
@@BrainsCloud Прочитал. Написано: "A can be associated with a control either by placing the control element inside the element, or by using the for attribute."
Где тут про "ненужный костыль"?
Я уже 10 лет верстаю, и для меня как раз аттрибут for - это ненужный костыль..
Egor Nikolaev если помещать туда ещё и текст, который относится к элементу формы то да, а то что вы сначала написали оборачивать input в label - в этом я не вижу никакого смысла
Почему мы пишем контент и оставляем его пустым?
Чтобы в псевдоэлементе ничего не было
Весь фронт на вот таких вот костылях
так и есть
ни что ни за чем не объяснено... просто проговаривание собственных действий... лажа а не урок.
Спасибо
А можете научить? как объяснить клиенту, что селект извините, с дерьмовым выпадающим списком это так и надо.
вы просите о невозможном
@@BrainsCloud значить учить нужно как сделать нормальные кастом селект.(((
Спасибо за очень полезный и понятный урок!
Спасибо!