HTML开发-.NET开发-VS2010添加CSS3.0验证以及HTML5模板创建

一.给VS2010添加CSS3.0验证

.Net Web的开发环境中需要使用到CSS3.0，但是在VS2010中只有自带的CSS2.1验证，导致很多时候会有

绿色线和红色线的警告和报错提示。

之前查阅了相关资料很多人说去下载Visual Studio 2010 SP1，很抱歉这个没用，不要被误导了哦。

上微软官方tools：

（1）搜索 CSS3 intellisense schema，下载并安装该补丁包。

（2）安装之后打开VS2010随便选择或创建一个Web项目，已经安装添加完毕，就不会再报错和警告了。

二.给VS2010添加HTML5模板

现在在开发轻量的Web我都在使用VS2015，毕竟速度快和功能强大，但是在工作上很多时候需要在

.net MVC环境下开发，多数时间使用VS2010，所以结合查阅资料得来的经验共享一下如何在VS2010里面

建立自己的HTML5开发模板。

首先，还是去微软tools：

（1）搜索Export Template Wizard，下载并安装该补丁包。

（2）打开VS2010，点击文件 新建 ->项目 ->ASP.NET 空 Web应用程序，命名随意。

（3）在项目中添加 新文件夹 css、images、js、默认index.html页

①在css文件夹中添加两个样式表，第一个样式表html5reset.css，默认填充内容如下：

html, body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,abbr, address, cite, code,del, dfn, em, img, ins, kbd, q, samp,small, strong, sub, sup, var,b, i,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary,time, mark, audio, video {    margin:0;    padding:0;    border:0;    outline:0;    font-size:100%;    vertical-align:baseline;    background:transparent;}body {    line-height:1;}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section {     display:block;}nav ul {    list-style:none;}blockquote, q {    quotes:none;}blockquote:before, blockquote:after,q:before, q:after {    content:'';    content:none;}a {    margin:0;    padding:0;    font-size:100%;    vertical-align:baseline;    background:transparent;}/* change colours to suit your needs */ins {    background-color:#ff9;    color:#000;    text-decoration:none;}/* change colours to suit your needs */mark {    background-color:#ff9;    color:#000;     font-style:italic;    font-weight:bold;}del {    text-decoration: line-through;}abbr[title], dfn[title] {    border-bottom:1px dotted;    cursor:help;}table {    border-collapse:collapse;    border-spacing:0;}/* change border colour to suit your needs */hr {    display:block;    height:1px;    border:0;       border-top:1px solid #cccccc;    margin:1em 0;    padding:0;}input, select {    vertical-align:middle;}

②添加一个空的Site.css样式表

③images文件夹为空不添加任何东西

④js文件夹中添加最基本的js文件：jquery-1.10.2.min.js 和 modernizr-2.6.2.js （2017年1月默认最新版本）

⑤添加index.html页面，以上步骤完成之后文件结构如下：（我创建的时候创建成了htm，注意改成html）

（4）使用之前安装的Export Template Wizard 插件对其操作，创建成HTML5的开发模板

①

②我之前犯了一个错误就是把index创建成htm文件，应该是html后缀的文件

③到这个页面啥也别动，直接Next

④选择你喜欢的图片作为icon，大小没限制

这页也什么不用填写，直接完成

然后打开文件 -> 新建->项目 就可以看到你的HTML5模板了，可以根据自己的需求往自己想

添加的模板里面加入bootstrap、font-awesome、button等Web框架，让你的模板更为强大。

PS：记住千万要选择小图标显示，翻到最后就能见到你的模板

用这个模板新建一个项目试试看~什么都有了~

由于第一次的icon随意添加的，第二次找了图标，感觉好很多~很高大上的样子

像素有点渣看不清楚，不过感觉很不错