不得不說，本人極度討厭網頁設計，感覺太麻煩了。不過整好啦還蠻有成就感的。
關於網頁設計，現在流行的是扁平化設計。
http://www.bootcss.com/p/flat-ui/
這個超好，很多樣式： http://demo1.cssmoban.com/cssthemes3/npts_13_cvo/index.html#
http://demo1.cssmoban.com/cssthemes3/npts_5_cvg/index.html
一個線上除錯html的網站： http://wow.techbrood.com/
一個特效資源： http://techbrood.com/
1. 路徑以及css重疊問題。
採用的是bootstrap.css +mystyle.css 的方式。
所以呼叫的時候需要先呼叫bootstrap，然後再呼叫mystyle。這個很重要。
<link href="/static/css/bootstrap.css" rel="stylesheet" media="screen" />
<link href="/static/css/mystyle.css" rel="stylesheet" type="text/css" />
2. 瀏覽器快取不更新的問題
問題：更新mystyle.css 之後，重啟伺服器，瀏覽器樣式依然不變。
解決方法： 後來通過 Ctrl+F5 強制重新整理解決。整了好久，一直以為是我的css路徑寫錯了呢。
3. bootstrap.css.map 404 問題
控制檯遇到： GET /static/css/bootstrap.css.map HTTP/1.1" 404
解決方案：
刪除bootstrap.css的最後一行即可：
/*# sourceMappingURL=bootstrap.css.map */
4. 表單樣式設計
Flask的表單有其獨有的格式 ：{{form.search(size=20)}}
這讓我一個前端白痴實在是不知道往哪裡放屬性。後來琢磨了兩種方法
1） {{search_case_form.search(size=20,class="form-control",placeholder="Search")}}
所有的屬性放這裡就可以啦。
2） 設計過程中需要對Textarea表單設定預設值，查了半天，說是Textarea沒有“value"屬性，事實上我也確實設定了"value"屬性也不可以。無奈只能採用第二種方式改寫Flask的表單。
<textarea id="caseComment" class="form-control" cols=32 rows=5 name="caseComment">{{case.comment}}</textarea>
5. 關於IE 和Firefox瀏覽器顯示不一致問題。
有些確實是瀏覽器相容的問題，但是有些我發現css翻譯的成果就不一樣。
結果發現是IE的 "Browser Mode"設定成 "IE9"之後， "Document Mode" 竟然是"Quirks Mode"，改成 "IE9 standards"就可以啦。
6. 關於檔案選擇器
http://plugins.krajee.com/file-basic-usage-demo