Это видео недоступно.
Сожалеем об этом.
These CSS PRO Tips & Tricks Will Blow Your Mind!
HTML-код
- Опубликовано: 5 май 2024
- 10 MINDBLOWING CSS Tips and Tricks that solve typical JavaScript problems with CSS ONLY. You will learn elegant solutions for everyday css problems and productive shorthands for responsive web design, How to implement modern design trends such as glassmorphism or new morphism smooth scroll snapping in swiper, how to use the :checked pseudo-class to create eventListener in CSS only. How to fix a common :focus pseudo-class problem to create a dropdown menu in css without the need of javascript. And much much more.
BEGINNERS START HERE:
👌 Learn HTML5 in one afternoon with our beginner course: www.udemy.com/course/coding2g...
Checkout our website for more:
👉 www.coding2go.com
Host Your Own Website With Hostinger:
👉 www.hostinger.com/coding2go
✌️ And get a huge discount with our code: CODING2GO
#cssonly #csstricks #webdevelopment
RELATED CONCEPTS YOU SHOULD LEARN:
How to code a Navbar: • Create a RESPONSIVE NA...
CSS Flexbox: • CSS Flexbox Tutorial f...
JavaScript: • How to learn JavaScrip...
Todo App Project: • Build & Deploy a TODO ...
SOURCES:
developer.mozilla.org/en-US/d...
developer.mozilla.org/en-US/d...
developer.mozilla.org/en-US/d...
developer.mozilla.org/en-US/d...
developer.mozilla.org/en-US/d...
developer.mozilla.org/en-US/d...
developer.mozilla.org/en-US/d...
developer.mozilla.org/en-US/d...
developer.mozilla.org/en-US/d...
developer.mozilla.org/en-US/d...
MUSIC & LICENCE
Track: "Little Things"
Music provided by Slip.stream
Free Download/Stream: get.slip.stream/QmMj1I
Track: "Scared Of The Glizzy"
Music provided by Slip.stream
Free Download/Stream: get.slip.stream/xPJ3rV
Track: "Take Off", NEFFEX
Music provided by Slip.stream
Free Download/Stream: get.slip.stream/GcQeOy
Listen on Spotify: go-stream.link/sp-neffex
Track: "Tropical Nights", Nico Sainato Tracks
Music provided by Slip.stream
Free Download/Stream: get.slip.stream/Hk8DVL
Listen on Spotify: go-stream.link/sp-nico-sainat...
CONCEPTS YOU WILL LEARN:
✔ HTML, CSS ONLY
✔ CSS Solution without JavaScript
✔ Responsive Web Design
✔ Smooth Scrolling in Swiper (scroll snapping)
✔ Modern UI Design Trends such as Glassmorphisn and New Morphism
✔ CSS Shortcuts and effective code solutions
✔ How do checkboxes and labels work (:checked pseudo-class)
✔ How does the :focus pseudo-class work in css
✔ How does the :focus-within pseudo-class work in css
✔ How to create a dropdown menu in css only without javascript
✔ How to use min() max() and clamp() functions
✔ How to resize elements in css
I hope you learned something new ;)
Hope you guys learned something new. Feel free to share your own css tricks in the comments for others to see 😎
Edit: I uploaded the source code for the tips on my website if you guys wanna check it out: www.coding2go.com
Subscribed immediately
Bro god will blessed you for this tutorial. you just shared some cool tricks and explain it perfectly. hope you will share more tricks with great explanation like this.
Very good video just subscribed. Please keep the vids coming
One trick I knew so far : to follow css-tricks.com
Very simple tutorial. Great content bro.
bro got straight in to the point, didn't waste a single sec of my life, worth it
Thought i was in like the 12th second or something 😂
and they are actually useful tips
I wasted by reading urs
I just got bombarded with information, not a single second to think about anything else rather than the CSS tips, just perfect!
I love how straight to the point you are, no lengthy intro no bullshit, i just love it , you got a new sub
Bro is the GOAT of CSS 💀
Incredible content, no BS, just tip after tip
That glass effect was super awesome 🥶
For accessibility concerns please don't misuse a checkbox for that purpose. Other than that some awesome tricks in here, especially the snapping slider.
Why not? In what way is this a problem with accessibility?
@@Semmelein because a checkbox alone tells nothing about the state of a menu. Just even try operating this example in a blind test with a screen reader.
Bro, I watched so many CSS tricks but this trick you gave is so awesome. Thanks bro, I didn't realize until now that ':not' and ':has' CSS new selectors can be so useful and CSS scroll trick is also so awesome too. Thanks a lot!!!
Do you have CSS beginner to advanced course? If no then you should definitely make one I will surely buy it.
We are currently working on a CSS course. The plan is to publish the course next month. We will let you know when the course is available.
@@coding2go ok, roger sensei !!!
Interested!
I'm big into JS-less sites and this video was fantastic. Such innovative design concepts - not to mention artistic and highly appealing.
Earned a sub from me!
Love the scroll-snap! Thank you vey much! Also the straight-to-the-point character of your tutes is highly appreciated! Subscribed!
Thank you! I appreciate the kind words. Welcome to the channel 👋
That was no bullshit straight to the point, informative, clean and helpful. New subscriber here.
Thanks, glad you like it! Welcome to the channel ✌️
That background-filter is awesome. Always wondered how that worked. Clamp is a nice to know as well! Learned something new. Appreciate the video!
Thank you
I absolutely love CSS, I’ve used the label trick before for dropdown messages. CSS is amazing
Being a UI developer for 5 years, I swear I learnt a lot new things today
Oh my god. I bookmarked this just to refer to it again and again. Buddy, THANK YOU!!!
Your video is really awesome! Eight years ago, I was completely focused on backend development. Only now am I realizing how much CSS has changed. It's crazy!
please make more video on css and one thing you do different is first you visualize the problem and then provide solution this is really amazing and helpful for beginners
Thanks, will do.
Bro I really want to more videos like this...
It's really helpful me❤
🔥. Thank you for this! Feeling inspired!!
Excellent. The missing space after the class name and open squirely brackets is getting to me!
Gradient trick for text is awesome, dude, thank you
Glad you like it!
This is the perfect video!! Thank you very much, I learned a lot of new, interesting and useful things in just 8 minutes. Keep up the good work!
Glad you liked it!
Thanks for these great CSS tips.
Great video bro, Just one thing you haven't mentioned in the video, If you rely on checkbox inputs to toggle the menu you have to make sure it won't ruin the accessibility, and as you mentioned users won't notice but the browsers, so becareful when you use checkboxes for other purposes.
great tips, straight in to the point
More like these! Absolute learnt a ton. An 8 minute video I spent over an hour watching trying everything out. I absolutely am stunned!
I didn't know about scroll snapping-that's dope. That new morphism one is cool too
This is a great video! Just a question, are most of these features supported by most modern browsers? They seem kind of new
Nice one! First time seeing many of these.
Awesome and usefull tips. Thanks for the great content.
Really helpful video. Like your simple way of teaching.
Could you please create a multi page website building video using html, CSS and js?
thx for the tip, now time to give this lesson a try on real code.
ps. like the way you straight in to the point ❤
This is awesome, nice job!
U gimme almost trick I don't know and still find it till I watched this video. Thanks
❤❤❤
No time waste to the point always love it ❤
This is genuinely one of the best tips and tricks videos I’ve seen
i love how you teach us the slide with snap. can you also upload a video how can you make a carousel type. for example, we have 5 slides, and after scolling the 5th slide, the one will popup is the 1st slide again.
Sure, I will make a video on that, though it needs some time until it comes out.
Bro Thank you so much❤❤. This video is incredible and it worth to watch. You earned one more subscriber.
Thank you so much! Explanation and presentation are awesome! Keep going in this way
Great video, I have only known about :hover pseudo class
These are very helpful thanks for sharing ❤
Thanks brother. I am coding from years but didn't know these features exist.
Love it! The RUclips Algorithm should recommend you. I gave you a thumbs up 👍.
Thank you 💙
many many thanks to share this 😊
Learned alot, & you didn't waste any time, much appreciated
you make it very simple and clear~! thanks a lot!!
Is there a way to make the draggable part of the Resize change which corner it is on, and thus change which direction you want to resize toward?
Thanks men, you are the goat
Amazing! Si much interesting tricks! Bravo!!!
Awesome 👍, I will to try that. Thank you, dude.
Thanks! Have fun
Wow. That text gradient trick was 🔥!! Next can you show me how you blur the background when I hover over my megamenu 🤪 (like apple’s website?) 😉
Love these simple yet so useful videos! Keep up the good work! 🎉
Thank you! Will do!
Amazing video, straight to the point, won a subscriber
Finally found a decent view on CSS. 🎉
Good content, thanks.
Was amazing 🤩
Dude .. this epic this
Take my sub👊
I just subscribed to you channel 🎉
This video was really helpful
really this is so much crazy fitures 💖
This Dude is the G O A T of CSS
this video blew my mind, can i do this in sass too?
Great video! Thanks for share
some new CSS features are great
Best video. Thanks for sharing this useful content.
Beautiful!!!
Is there a way to implement a Modal Dialog that swipes from the bottom up and can be controlled by the user?
Great.❤
Make video on sticky thead or give alternative way to sticky.
Position sticky don't apply if parents are using overflow.
That was cool tricks, thanks dude blessings for you
What an absolutely fantastic video thank you
Many many thanks sir, great tips and content.
It was amazing... Thank you so much man
I never knew people can be so creative with css. Haha
Nice tips!
Thank you, today I learned something new 🥂
awesome tips! thanks!
Loss of devs appreciate this kind of teaching approach
Your content ✨️, that's why I subscribed to you 🎉,how many years taken to learn those techniques 😅
🎉🎉😮 am speechless
Very helpful, thank you bro 😍
Nice vid, actually didn’t know most of these
Thanks today I learn something new brother ❤🎉
That was really helpfull, thank you.
Great quick tutorial.
Very cool man. Could you please let me know from where I can learn more properties like this ?
Hey thanks! Unfortunately I don't know any place online, where they teach this specificly. The video is basically a summary of cool little tricks that I accumulated over the years. Since these tricks are very specific, I would say that simply spending a lot of time coding and finding clever solutions for specific problems, will be the most useful. You could also follow us on X (twitter). 😉 I will start posting web dev tricks there everytime I find about something new: x.com/codingtogo
@@coding2go Thanks, I will follow for sure
You earned a sub bruh. ❤
really this tutorial was mind blowing 😊
such a great video. subscribed
Thanks 💙
More Videos Like this please
Great work mate. Can u also make a video on css viewport function? For example I have an animation and it will only animate when the user reaches that part. I tried and failed.
4:02, 4:36, 5:36, 6:49 before thingy, overflow,
Damn, great video.
Ok the snap thing is really new to me :O
subscribed inmediatly!!
Thanks, welcome to the channel 💙
Moral of the video: (atleast for me) use pseudo classes more
Exactly 💯
Привіт з України! Щиро дякую Вам! Really well done. I gained a few things from here. Thank you.
Great content, i learned something so you have my subscribe
Awesome, thank you! Welcome to the channel 👋
Worth it❤
I knew all those tips, up to the last.