CSS Card Tricks
A beginner's tutorial for building an 🃏 animated stacked card list with CSS & HTML. Inspired by css-tricks homepage. https://fireship.io/lessons/css-cards-animated/
Inspired by https://CSS-tricks.com homepage
Source https://github.com/fireship-io/stacked-card-list
00:00 Intro
00:36 Layout
02:55 Shadows
03:20 Scrollbar
03:55 Animation
05:30 SVG Semicircle
07:48 Gradient Text
#css #tutorial
Install the quiz app 🤓
iOS https://itunes.apple.com/us/app/fireship/id1462592372?mt=8
Android https://play.google.com/store/apps/details?id=io.fireship.quizapp
Upgrade to Fireship PRO at https://fireship.io/pro
Use code lORhwXd2 for 25% off your first payment.
My VS Code Theme
- Atom One Dark
- vscode-icons
- Fira Code Font
Видео CSS Card Tricks канала Fireship
Inspired by https://CSS-tricks.com homepage
Source https://github.com/fireship-io/stacked-card-list
00:00 Intro
00:36 Layout
02:55 Shadows
03:20 Scrollbar
03:55 Animation
05:30 SVG Semicircle
07:48 Gradient Text
#css #tutorial
Install the quiz app 🤓
iOS https://itunes.apple.com/us/app/fireship/id1462592372?mt=8
Android https://play.google.com/store/apps/details?id=io.fireship.quizapp
Upgrade to Fireship PRO at https://fireship.io/pro
Use code lORhwXd2 for 25% off your first payment.
My VS Code Theme
- Atom One Dark
- vscode-icons
- Fira Code Font
Видео CSS Card Tricks канала Fireship
Показать
Комментарии отсутствуют
Информация о видео
Другие видео канала
Learn Vue.js (RU): Quasar Framework - build SPA, SSR, PWA, Electron and Mobile apps with VuejsAnimation with GSAP - the basics [ A beginners guide to SVG part 5 ]10 CSS Pro Tips - Code this, NOT that!The Joy of CSS Grid - Build 3 Beautifully Simple Responsive LayoutsNode.js Ultimate Beginner’s Guide in 7 Easy Steps5 Ways to DevOps-ify your App - Github Actions Tutorial7 Web Features You Didn’t Know ExistedRaspberry Pi versus AWS // How to host your website on the RPi441 Unexpected Minecraft Build HacksAdvanced CSS Tricks for Web DevelopersAnimated Responsive Navbar with CSS - Plus Other Useful Tricks7 Full Stack App Ideas for Developers w/ Instructions IncludedTop 20 CSS & Javascript Effects | March 2020JavaScript: How It's MadeMake Awesome SVG Animations with CSS // 7 Useful Techniques7 Security Risks and Hacking Stories for Web DevelopersLearn CSS Position In 9 MinutesAre you writing responsive CSS the wrong way?JavaScript Pro Tips - Code This, NOT ThatMongoDB in 100 Seconds