最近網上看了好多html開發中那些問題和不好的習慣，順手總結一下。
一、上下間距
在開發中你會發現你明明設定的兩個p标簽上下間距為20px但你實際測量中會發現他會多4~8px，這是為什麼呢！如果你是老司機我想我就不用多說了，
因為設計稿中量的都是字與字上下的間距，其實你寫p标簽檢查一下元素，p表标簽會有留白，大概是會有上下都有2px左右的留白。這樣的話在加上你的
上邊距或下邊距你在量的時候就多了點。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
p:nth-child(1){
margin-bottom: 20px;
}
</style>
</head>
<body>
<p>p1</p>
<p>p2</p>
</body>
</html>
當你在測量時，我們上邊是20px的下外邊距這時我們測量一下；
ps：如果你有【翻牆工具的話】不妨在Google浏覽器商城下載下傳一個Page Ruler，個人認為非常好用的一個測量網頁的工具。
發現沒有20的間距成功的變為25，這就是p标簽的留白。
二、錯誤的嵌套
這種嵌套當裡面在寫有内容時，當一屏看不完時，一時嵌套錯誤這個可就有你煩的了。最好的解決嗎？我感覺還是注釋，一個良好的注釋習慣，讓你可以更快找到自己的問題還有利于團隊的開發。
這樣時你還會找錯嗎？當你修改時是不是更友善了。
三、form和table到底先寫誰，當然這個問題隻會發生在新手身上
錯誤：
<table><form><tr><td>..... </td></tr></form></table>
正确：
<form><table><tr><td>..... </td></tr></table></form>
按我個人的了解來說，把form寫在table中太别扭了。因為table是一個完整的格式，是以說用from來包裹table。
四、省略img alt 屬性
當你在網速不佳或圖檔無法顯示的時候，他的作用就來了。你可以帶有你圖檔的描述，讓使用者在沒看到的前提下，也明白這是什麼。
五、大量使用轉義标簽 如： ； ⁢ >..........
因為在每個浏覽器如 ：  預設寬度是不等的，是以當你使用大量  ； 時換個浏覽器他就變了。是以說現在這莫多好用的方式為啥還用如此
lo的轉義标簽， 其實還有比較實用的如：©； © 版權商标等等；
六、偏愛于一款浏覽器，由于浏覽器核心不同，他支援的效果也不同，當你偏愛于一款浏覽器時，你在别的浏覽器你會崩潰的 。
ps：當然IE除外 IE 低版本太可怕，都這個年代了堅決抵制 IE 低版本，當然這隻是個人看法，畢竟有資料支援用 IE 低版本使用者是有還是又不算少的使用者群
有的比如：國企采購 windows 自帶 IE 而且國企為了安全買回來後沒有更新那一說。當外包到一個國企而且進門不讓帶手機的，到時候你就明白了。
七、錯誤的提示方式。
當你給了使用者錯誤的提示時，你說收集的資料也将會出現很大的偏差，如：“請輸入位址” ，這個位址你是要家庭位址呢！還是現住位址呢！還又是公司位址呢！是以明确的提示很重要。
八、頁面中包含太多重新整理的步驟。
通過ajax局部重新整理，來減少頁面的重複加載。增強使用者的體驗。
轉載于:https://www.cnblogs.com/durenlong/p/7050539.html