一.給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隨意添加的,第二次找了圖標,感覺好很多~很高大上的樣子
像素有點渣看不清楚,不過感覺很不錯