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:
press enter
To make a div with an id name:
press enter
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.
dev.to/robsonmuniz16/3-ways-to-cen...
Nice! Love your blog post!
Thanks for this! This surely can be useful.
I have used this over and over again since you shared this tip. Thank you!
Yay! :)
Thanks
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!!
So cool!
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
I felt cool making my divs this way too buddy but then I tried to super-customize vscode and somehow it does not do it anymore !