DEV Community

loading...
Cover image for Some small Css tips #007

Some small Css tips #007

vanaf1979 profile image Stephan Nijman Originally published at since1979.dev ・1 min read

To continue on my previous post here are some more tweets with little Css tips that might help you in your projects.

Css transition delay.



Css transition docs https://developer.mozilla.org/en-US/docs/Web/CSS/transition

Css contrast filter.



Css filter docs: https://developer.mozilla.org/en-US/docs/Web/CSS/filter

Css Hsl colors introduction.



CodePen: https://codepen.io/Since1979/pen/dyOYvJO

Css border styles.


Css border-style docs: https://developer.mozilla.org/en-US/docs/Web/CSS/border-style

Swapping colors with css custom properties.




I also did a youtube video on this: https://www.youtube.com/watch?v=Yl2j_b82zwo

Css custom properties docs: https://developer.mozilla.org/en-US/docs/Web/CSS/Using_CSS_custom_properties

Subscribe and Follow

Subscribe to my Youtube channel.

Follow me on Twitter

Thanks for reading/watching and stay safe

Discussion (8)

pic
Editor guide
Collapse
porphyrogennitos profile image
Dionysis

About "CSS border styles". Can I use border-style: none solid none if I want borders only left and right instead of none solid solid none?

Collapse
vanaf1979 profile image
Stephan Nijman Author

Yes you can! :)

Collapse
ratuloss profile image
Ratul

useful :)

Collapse
vanaf1979 profile image
Stephan Nijman Author

Thank you Ratul. Glad you think that! :)

Collapse
obscuregit profile image
Obscure-Git

My favorite one out of this list is use of HSL because I like to use it too , great post!

Collapse
vanaf1979 profile image
Stephan Nijman Author

Thank you! Hsl really is amazing! :)

Collapse
cchana profile image
Charanjit Chana

I’ve rarely used the delay option for transitions so had no idea it could be done in one line!

Collapse
vanaf1979 profile image
Stephan Nijman Author

For a long time i didn't even know it existed! But it's a nice one to know about! :)