HTML Snippets in Visual Studio 2010

DZone 's Guide to

HTML Snippets in Visual Studio 2010

· ·
Free Resource

Visual Studio is full of code snippets that can make your life easier. You can type "prop" then the [Tab] key and get a snippet that will quickly let you build a C# property in your class. Typing "ctor" + [Tab] with give you a constructor for your class. What you may not know, is that there are several available for HTML.

If you are like me, you still need to use tables on occasion. Don't get me wrong; I'm on board with the whole concept of using DIVs and CSS as much as possible, but there are cases where tables just make more sense. It's always a pain having to type out everything in the table (ok so it's not really a pain, I'm just lazy). Luckly, there are some cool snippets baked into Visual Studio 2010 to help. I can simply type "table" in my ASP.NET page and hit [Tab]. This code replaces it:

<table border="0" cellpadding="0" cellspacing="0">

It give me all of the options I normally set like the cell padding and cell spacing. It's really awesome because I only have to hit 6 keys instead of 60. Most HTML tags are supported. I can type "a" + [Tab] and get:

<a href="#">content</a>

Or "div" + [Tab] and get:


Typing "form" + [Tab] gives you:

<form action="default.aspx" method="post">

And "input" + [Tab] gives you:

<input type="text" name="name" value=" " />

With several of these, when you hit [Tab] again it will take you to sections that need to be configured. For example, hitting [Tab] a second time when using "input" will take you to the part of the tag to put in the type. Tabbing again will get you to the name and again to get to the value. The snippets can make your life much easier when hand crafting HTML in Visual Studio 2010. Microsoft has been put an emphasis on developer productivity and this is just one of those little things helps.


Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}