div和span、relative和absolute、display和visibility區別

div和span、relative和absolute、display和visibility是很容易混淆和弄錯的html標簽與css屬性，現在簡單的羅列出它們的區別與使用要點，供大家參考。
 
一、div和span的區別
 　　div是一個塊級元素，可以包含段落，表格等內容，用于放置不同的內容。一般我們在網頁通過div來布局定位網頁中的每個區塊。
 　　span是一個內聯元素，沒有實際意義，它的存在純粹是為了應用樣式，給一段內容加上<span></span>標記可以通過在span上定義樣式來設定其內容的樣式。
 
二、relative和absolute的區別
 　　relative，css中的寫法是：position:relative;  他的意思是絕對相對定位，他是參照父級的原始點為原始點，無父級則以body的原始點為原始點，配合trbl進行定位，當父級內有padding等css屬性時，當前級的原始點則參照父級內容區的原始點進行定位。
 　　absolute，css中的寫法是：position:absolute; 他的意思是絕對定位，他是參照瀏覽器的左上角，配合top、right、bottom、left(下面簡稱trbl)進行定位，在沒有設定trbl，默認依據父級的做標原始點為原始點。如果設定trbl并且父級沒有設定position屬性，那么當前的absolute則以瀏覽器左上角為原始點進行定位，位置將由trbl決定。
 
三、display和visibility的區別
 　　display:none和visibility:hidden都可以隱藏一個元素
 　　但visibility:hidden只是隱藏了元素的內容，但其使用的位置空間仍然被保留。
 　　而display:none則相當把元素從頁面中去除，其占用位置也將被刪除。