Although I am new to web development, I can 100% appreciate a shortcut for writing code.
While I was watching a tutorial video, I saw someone use this shortcut for making a div with a class name or id name in VS code. It blew my mind and I just had to share!
Instead of writing out the complete div tag plus the class or id name, write the class name with a period in front of it, or the id name with a pound symbol in front of it. Press enter and you're done.
To make a div with a class name:
To make a div with an id name:
P.S. I hate to admit it, but I feel 10x cooler when I make my divs this way!
Top comments (13)
Emmet snippets and expansion are built right into VS Code (but is supported in many different editors/IDEs) and provides many more HTML shortcuts: Cheat sheet
Awesome! Thank you for sharing!!
This is Emmet, it helps a lot I use it all the time...
After creating those you can learn how to easily center them.
Nice! Love your blog post!
Thanks for this! This surely can be useful.
I have also just started using VS Code and I am amazed and blown away by all the features it has.
Thanks for your tip! ;)
I am as well!!
I have used this over and over again since you shared this tip. Thank you!
this is great! after messing around a bit there's also a shorter way.
.div will create a div class and #div will create a div ID