區(qū)別div和span、relative和absolute、display和visibility
發(fā)布時間：2009-12-17 00:11:02 作者：佚名 
我要評論
我要評論div和span、relative和absolute、display和visibility是很容易混淆和弄錯的HTML標(biāo)簽與CSS屬性，今天52CSS.com簡單的羅列出它們的區(qū)別與使用要點，供大家參考。
一、div和span的區(qū)別
div是一個塊級元素，可以包含段落，表格等內(nèi)容，用于放置不同的內(nèi)容。一般我們在網(wǎng)頁通過div來布局定位網(wǎng)頁中的每個區(qū)塊。
span是一個內(nèi)聯(lián)元素，沒有實際意義，它的存在純粹是為了應(yīng)用樣式，給一段內(nèi)容加上<span></span>標(biāo)記可以通過在span上定義樣式來設(shè)定其內(nèi)容的樣式。
二、relative和absolute的區(qū)別
relative，CSS中的寫法是：position:relative; 他的意思是絕對相對定位，他是參照父級的原始點為原始點，無父級則以BODY的原始點為原始點，配合TRBL進行定位，當(dāng)父級內(nèi)有padding等CSS屬性時，當(dāng)前級的原始點則參照父級內(nèi)容區(qū)的原始點進行定位。
absolute，CSS中的寫法是：position:absolute; 他的意思是絕對定位，他是參照瀏覽器的左上角，配合TOP、RIGHT、BOTTOM、LEFT(下面簡稱TRBL)進行定位，在沒有設(shè)定TRBL，加盟網(wǎng)默認(rèn)依據(jù)父級的做標(biāo)原始點為原始點。如果設(shè)定TRBL并且父級沒有設(shè)定position屬性，那么當(dāng)前的absolute則以瀏覽器左上角為原始點進行定位，位置將由TRBL決定。
三、display和visibility的區(qū)別
display:none和visibility:hidden都可以隱藏一個元素
但visibility:hidden只是隱藏了元素的內(nèi)容，但其使用的位置空間仍然被保留。
而display:none則相當(dāng)把元素從頁面中去除，其占用位置也將被刪除。
div是一個塊級元素，可以包含段落，表格等內(nèi)容，用于放置不同的內(nèi)容。一般我們在網(wǎng)頁通過div來布局定位網(wǎng)頁中的每個區(qū)塊。
span是一個內(nèi)聯(lián)元素，沒有實際意義，它的存在純粹是為了應(yīng)用樣式，給一段內(nèi)容加上<span></span>標(biāo)記可以通過在span上定義樣式來設(shè)定其內(nèi)容的樣式。
二、relative和absolute的區(qū)別
relative，CSS中的寫法是：position:relative; 他的意思是絕對相對定位，他是參照父級的原始點為原始點，無父級則以BODY的原始點為原始點，配合TRBL進行定位，當(dāng)父級內(nèi)有padding等CSS屬性時，當(dāng)前級的原始點則參照父級內(nèi)容區(qū)的原始點進行定位。
absolute，CSS中的寫法是：position:absolute; 他的意思是絕對定位，他是參照瀏覽器的左上角，配合TOP、RIGHT、BOTTOM、LEFT(下面簡稱TRBL)進行定位，在沒有設(shè)定TRBL，加盟網(wǎng)默認(rèn)依據(jù)父級的做標(biāo)原始點為原始點。如果設(shè)定TRBL并且父級沒有設(shè)定position屬性，那么當(dāng)前的absolute則以瀏覽器左上角為原始點進行定位，位置將由TRBL決定。
三、display和visibility的區(qū)別
display:none和visibility:hidden都可以隱藏一個元素
但visibility:hidden只是隱藏了元素的內(nèi)容，但其使用的位置空間仍然被保留。
而display:none則相當(dāng)把元素從頁面中去除，其占用位置也將被刪除。
相關(guān)文章
- DIV 和 SPAN 元素最大的特點是默認(rèn)都沒有對元素內(nèi)的對象進行任何格式化渲染。主要用于應(yīng)用樣式表。兩者最明顯的區(qū)別在于DIV是塊元素，而SPAN是行內(nèi)元素(也譯作內(nèi)嵌元素)。2014-04-03
新手在使用web標(biāo)準(zhǔn)（div css）開發(fā)網(wǎng)頁的時候，遇到第一個問題是div與span有什么區(qū)別，什么時候用div，什么時候用span標(biāo)簽。下面小編就通過本文給大家講解下，感興趣的朋友2021-11-30
