2、在“文件”菜单中，依次选择“新建”和“项目”。将打开“新建项目”对话框。在 Visual Basic 或 Visual C# 中选择“WEB应用程序”，然后将其命名为“HTML5Template”。单击“确定”。
3、在这个项目中添加下面这些文件。
两个分别放置js和css的文件夹：css、js
HTML5基本模板页：index.html
jQuery：jquery-1.4.2.min.js
Modernizr ：modernizr-1.5.min.js
HTML5 样式文件：html5reset.css
一个空的css文件：style.css
关于VS里的设计模式显示不正常的问题，是有多方面的，但这个问题并不是任何时候都需要解决。
下面分别说明几种常见的：
1、动态代码引起的预览不正确。
比如我做了简单的导航条效果：
，我在单独的css文件里写了样式，但是因为某种需要，我的css文件加载是代码写进去的。比如：
这时候，如果切换到设计视图下，由于css的地址是一个变量，或者是需要代码执行出来才有结果的，设计视图不可能知道此时css的地址是什么，自然也就没有办法正确的载入css文件。所以预览的效果就变成了：
但实际上，我运行出来，正确执行之后的效果是：
这是不是挺像你截图里描述的效果？从你的截图来看，你所有的样式都没有显示出来，因为css文件在预览的时候无法加载，执行之后，在生成页面的时候变量解释成了正确的地址之后效果就正确了。
所以我首先怀疑你的页面里，css连接的部分使用了某些动态的代码来实现。
如果是这样，这个问题根本就没有解决的必要。原因前面也说了，你怎么能要求vs去猜你的变量在还没运行时候的值呢？这才是变量的意义。
2、html代码的兼容性问题。
我们知道html有过好几个标准，而且不同的浏览器内核之间支持的部分还不完全相同。而vs中使用的是ie的内核。和你在谷歌浏览器中看到的效果有出入是很常见的问题。
比如同样的一个代码：
在IE和谷歌浏览器下运行出来的效果你看到差别在哪了吗？
毫无疑问的，VS的设计模式的确是使用的IE内核，请看设计模式下的预览：
所以，如果你的代码中存在这些兼容性不好的写法，那么是会出现一些不一致的。小的排版问题在内容比较多的页面里会产生一些互相的挤压和移位。导致整体页面变得乱七八糟。
如果是这种情况，那么你可以解决它，你要找到出问题的地方，替换成更兼容的写法。
3、html5和css3，以及可视化编辑器的问题
由于IE从IE9开始才能较好的支持HTML5和CSS3（但是还是比不上谷歌和FF），所以如果你的页面主要是以这些新的技术为主的话，那么确实在设计视图下可能会出现预览不对的情况。
但是我想说的是，可视化的编辑器始终只是一个参考，特别是VS，他的设计模式主要是方便开发人员拖放一些服务器控件上来，和调整他们的大致位置（一些容器控件的包含之类的），VS本身也在设计视图的时候加入了大量的辅助线框和一些占位的但是最后不会显示出来的东西。所以基本上不会有哪个成熟的开发人员真的会用设计视图来完成UI设计。
应该这样讲，这个设计视图的最大作用是用来参考，但不必太在意其中的细节，该有的东西有了，互相之间的包含关系对了，剩下的就看运行出来的效果。最终效果始终是以运行出来后浏览器的效果为基准，所以一般都是直接在vs里调整html源码，然后运行了看效果。
4、总结
虽然你的问题问的是，有什么办法能让VS里的内核切换成谷歌浏览器里的效果。
但是看了我上面的分析，我想你应该明白，这个问题的本质不在于用什么内核来预览，你只要够理解你自己写的代码，你就不用担心它在这里显示成什么样。
你应该关心的是，运行出来后，把地址复制到谷歌浏览器，IE，Firefox甚至是safari中，看看页面的表现是否相差不大。
既然VS里的内核是IE的，你为什么不在IE下看看运行出来是否也是设计视图的这个样子呢？
如果也是这样乱乱的，请确认你使用的是IE9以上的版本，和保证你的代码兼容性。
明白了吗？不要纠结这个问题了。
html5 是一种标准啊，全部都是文本代码，可以用任何的可以写文本的软件去开发啊。你用vs2010，写字板，文本，DR都可以去开发，保存的文件只要是.html或者是.htm .asp. php 都是可以的呀。没有什么固定软件去开发的。 你要是想学习html5的话就就像楼上说的 ，去W3School，最权威的网站。本回答由 睿典(www.ruidian88.com)回答。
