This is
the second post in a series
of posts titled "What's new in ASP.Net 4.5 and VS
2012".You can have a look at
the first post in this series, here. Please find all my posts regarding VS
2012, here. In this post I will be looking into
the various new features available in ASP.Net 4.5 and VS
2012.I will be looking into
the enhancements in
the HTML Editor,CSS Editor and Javascript Editor.In
order to follow along this post you must have Visual Studio
2012 and
.Net Framework 4.5 installed in your machine.Download and install VS
2012 using this link.My machine runs on Windows 8 and Visual Studio
2012 works just fine.I will work fine in Windows 7 as well so do not worry if you do not have
the latest Microsoft operating system.1) Launch VS
2012 and create a new Web Forms application by going to File - >New Web Site - > ASP.Net Web Forms Site.2) Choose an appropriate name for your web site.3) I would like to point out
the new enhancements in
the CSS editor in VS
2012. In
the Solution Explorer in
the Content folder and open
the Site.cssThen when I try to change
the background-color property
of the html element, I get a brand new handy color-picker. Have a look at
the picture below Please note that
the color-picker shows all
the colors that have been used in this website. Then you can expand
the color-picker by clicking on
the arrows. Opacity is also supported. Have a look at
the picture below4) There are also mobile styles in
the Site.css .These are based on media queries.Please have a look at another post
of mine on CSS3 media queries. Have a look at
the picture below In this case when
the maximum width
of the screen is less than 850px there will be a new layout that will be dictated by these new rules. Also CSS snippets are supported. Have a look at
the picture below I am writing a new CSS rule for an image element. I write
the property transform and hit tab and then I have cross-browser CSS handling all
of the major vendors.Then I simply add
the value rotate and it is applied to all
the cross browser options.Have a look at
the picture below. I am sure you realise how productive you can become with all these CSS snippets. 5) Now let's have a look at
the new HTML editor enhancements in VS 2012You can drag and drop a GridView web server control from
the Toolbox in
the Site.master file.You will see a smart tag (that was only available in
the Design View) that you can expand and add fields, format
the web server control.Have a look at
the picture below 6) We also have available code snippets. I type <video and then press tab twice.By doing that I have
the rest
of the HTML 5 markup completed.Have a look at
the picture below 7) I have new support for
the input tag including all
the HTML 5 types and all
the new accessibility features.Have a look at
the picture below 8) Another interesting feature is
the new Intellisense capabilities. When I change
the DocType to 4.01 and
the type <audio>,<video> HTML 5 tags, Intellisense does not recognise them and add squiggly lines.Have a look at
the picture below All these features support ASP.Net Web forms, ASP.Net MVC applications and Web Pages. 9) Finally I would like to show you
the enhanced support that we have for Javascript in VS
2012. I have full Intellisense support and code snippets support.I create a sample javascript file. I type If and press tab. I type while and press tab.I type for and press tab.In all three cases code snippet support kicks in and completes
the code stack. Have a look at
the picture below We also have full Intellisense support.Have a look at
the picture below I am creating a simple function and then type some sort
of XML like comments for
the input parameters. Have a look at
the picture below. Then when I call this function, Intellisense has picked up
the XML comments and shows
the variables data types.Have a look at
the picture below Hope it helps!!!
