css display:none使用注意事項(xiàng)小結(jié)
更新時(shí)間：2008年09月10日 23:43:32 作者：
web頁面前臺(tái)編碼時(shí)經(jīng)常用到display:none樣式，平常使用時(shí)發(fā)現(xiàn)有幾點(diǎn)特征需要注意
1、如果在樣式文件或頁面文件代碼中直接用display:none對(duì)元素進(jìn)行了隱藏，載入頁面后，在沒有通過js設(shè)置樣式使元素顯示的前提下，使用js代碼會(huì)無法正確獲得該元素的一些屬性，比如offSetTop,offSetLeft等，返回的值會(huì)為0，通過js設(shè)置style.display來使元素顯示后才能正確獲得這些值。
2、使用display:none隱藏的元素不會(huì)被百度等搜索網(wǎng)站檢索，會(huì)影響到網(wǎng)站的SEO，某些情況下可以使用left:-100000px來達(dá)到同樣效果。
3、如果是通過樣式文件或<style>css</style>方式來設(shè)置元素的display:none樣式，用js設(shè)置style.display=""并不能使元素顯示，可以使用block或inline等值來代替。通過style="display:none"直接在元素上進(jìn)行的設(shè)置不會(huì)有這個(gè)問題
4、有些情況下可以使用style.visibility來代替style.display，但是要注意的是style.visibility隱藏元素時(shí)會(huì)保留元素在頁面上所占的空間，而style.display隱藏元素且讓出所占頁面空間。
2、使用display:none隱藏的元素不會(huì)被百度等搜索網(wǎng)站檢索，會(huì)影響到網(wǎng)站的SEO，某些情況下可以使用left:-100000px來達(dá)到同樣效果。
3、如果是通過樣式文件或<style>css</style>方式來設(shè)置元素的display:none樣式，用js設(shè)置style.display=""并不能使元素顯示，可以使用block或inline等值來代替。通過style="display:none"直接在元素上進(jìn)行的設(shè)置不會(huì)有這個(gè)問題
4、有些情況下可以使用style.visibility來代替style.display，但是要注意的是style.visibility隱藏元素時(shí)會(huì)保留元素在頁面上所占的空間，而style.display隱藏元素且讓出所占頁面空間。
相關(guān)文章
HTTP與HTTPS超文本傳輸協(xié)議的區(qū)別是什么
隨著越來越多的網(wǎng)站使用HTTPS加密，現(xiàn)在HTTPS的使用已經(jīng)成了硬性要求了。雖然說https是http的安全版，但兩者還是有不少區(qū)別的。本文從https、http的概念和原理入手，講解他們的不同，讓讀者朋友能夠真正理解。2022-12-12
轉(zhuǎn)自國外網(wǎng)站，本想翻譯成中文，但是細(xì)看文章實(shí)在是簡(jiǎn)單，如果看不懂這個(gè)，我想也就沒必要繼續(xù)做前端了。2008-02-02
關(guān)于超鏈接的下劃線 使用說明...2007-08-08
CSS樣式表的背景渲染效率...2006-12-12
有時(shí)候圖片太大，會(huì)破環(huán)網(wǎng)頁整齊的布局。這時(shí)可以用css來強(qiáng)制按比例壓縮圖片的高度或?qū)挾取?/div> 2008-06-06
很多CSSer是從以前的網(wǎng)頁制作中開始學(xué)習(xí)CSS網(wǎng)頁布局的，或許還存在著一定的DW習(xí)慣。希望此文能幫助大家理解和糾正一些不好的習(xí)慣。2008-11-11
跨瀏覽器的實(shí)踐:position:fixed 層的固定定位
一般要固定某個(gè)div,我們都會(huì)讓該div{position:fixed},它的下一個(gè)div{position:absolute}看了幾個(gè)國外的關(guān)于CSS的固定定位跨瀏覽解決方案.他們卻反其道而為之2008-11-11
CSS的margin邊界疊加深度剖析圖文演示...2007-09-09
用<TABLE>語句來實(shí)現(xiàn)圓角表格可以省去制作圓角圖片之苦！
用<TABLE>語句來實(shí)現(xiàn)圓角表格可以省去制作圓角圖片之苦！...2007-04-04
超贊的隨機(jī)顏色搭配工具...2007-05-05最新評(píng)論