Wrap Selection With Tag
Use the keyboard to put a wrapper tag around a selection of code.
HTML tag surrounding, the easy way.
You need a div
around a block. Use the keyboard not just for
selection, but also for adding the tag to surround with.
You're in an HTML file, working on a nice block of markup, and realize your
CSS framework wants a wrapper <div>
. Don't they always? What's another
<div>
, right?
You could use mouse to move to the start, type in <div>
, go to the end,
type in </div>
, and by then you forgot what you were doing.
Instead:
Invoke
Surround With
(Shift-Ctrl-A
Win/Linux,Alt-Cmd-T
macOS)Hit
T
to chooseSurround with <tag></tag>
in the Live Templates sectionIn the prompt, type the name of the tag
If you're a fan of the Emmet system for quickly generating markup, you can also surround with Emmet.