Перейти к содержимому

Как создать такую продвинутую форму ввода кредитной карты на CSS/JavaScript

Web Dev Simplified

0:00 / 0:00

Как создать такую продвинутую форму ввода кредитной карты на CSS/JavaScript

48 342 просмотра · 4 г. назад
Web Dev Simplified
1,78 млн подписчиков
48 342 просмотра · 4 г. назад
Недавно я наткнулся на очень классный CodePen с полями для ввода данных кредитных карт, и один дизайн особенно меня зацепил. Я потратил много времени на его воссоздание, и это видео — пошаговое руководство по созданию финального варианта этого дизайна. В нём много сложных ограничений CSS и JS, что очень интересно. 📚 Материалы/Ссылки: Код на GitHub: https://github.com/WebDevSimplified/c... Ссылка на CodePen: https://codepen.io/Dallian/pen/ExoLwvE Статья «Почему я использую атрибуты данных в JavaScript»: Видео Emmet:    • Learn Emmet In 15 Minutes - Double Your HT...   Видео HSL:    • Are You Making This Mistake With CSS Colors?   Статья HSL: https://blog.webdevsimplified.com/202... Видео «Расширенные концепции Flexbox»:    • 6 Advanced Flexbox Features You Probably D...   Видео «Определение и асинхронность»:    • What Is The Fastest Way To Load JavaScript   Статья «Определение и асинхронность»: https://blog.webdevsimplified.com/201... Видео о регулярных выражениях:    • Learn Regular Expressions In 20 Minutes   🌎 Найдите меня здесь: Мой блог: https://blog.webdevsimplified.com Мои курсы: https://courses.webdevsimplified.com Patreon:   / webdevsimplified   Twitter:   / devsimplified   Discord:   / discord   GitHub: https://github.com/WebDevSimplified CodePen: https://codepen.io/WebDevSimplified ⏱️ Временные метки: 00:00 - Введение 01:18 - HTML 11:26 - CSS 24:33 - JavaScript #CSS #WDS #JavaScript