1、overflow:hidden; 這是防止溢出,也是一種隱藏,只不過是把超出范圍的元素隱藏,這種一般用于文字過多或者圖片特效以及自適應(yīng)中div沒法設(shè)置高度時(shí)使用
2、display:none;這就是完全的隱藏了,直接消失,任何對該元素直接的用戶交互操作都不可能生效,被隱藏的元素完全不會(huì)占用空間,仿佛元素完全不存在一樣。
3、利用opacity透明度來隱藏,opacity設(shè)置為0,它只是一種視覺隱藏,元素本身依舊占用它的位置并對網(wǎng)頁的布局起到作用,它也同樣影響用戶交互。在讀屏軟件中會(huì)被識別。
4、position:元素的定位。把position:absolutely;top:-4555px;left:-45545px;top和left設(shè)置成足夠大的負(fù)數(shù),相當(dāng)于把元素放到可視區(qū)域外,它不會(huì)影響布局,能夠讓元素保持可操作性,在讀屏軟件上可以被識別。
5、visibility:規(guī)定元素 是否可見,一般設(shè)置為hidden,它可以很好的隱藏,不會(huì)影響用戶的交互,在讀屏軟件中不會(huì)被識別。
1、overflow:hidden; 這是防止溢出,也是一種隱藏,只不過是把超出范圍的元素隱藏,這種一般用于文字過多或者圖片特效以及自適應(yīng)中div沒法設(shè)置高度時(shí)使用2、display:none;這就是完全的隱藏了,直接消失,任何對該元素直接的用戶交互操作都不可能生效,被隱藏的元素完全不會(huì)占用空間,仿佛元素完全不存在一樣。
3、利用opacity透明度來隱藏,opacity設(shè)置為0,它只是一種視覺隱藏,元素本身依舊占用它的位置并對網(wǎng)頁的布局起到作用,它也同樣影響用戶交互。在讀屏軟件中會(huì)被識別。
4、position:元素的定位。把position:absolutely;top:-4555px;left:-45545px;top和left設(shè)置成足夠大的負(fù)數(shù),相當(dāng)于把元素放到可視區(qū)域外,它不會(huì)影響布局,能夠讓元素保持可操作性,在讀屏軟件上可以被識別。
5、visibility:規(guī)定元素 是否可見,一般設(shè)置為hidden,它可以很好的隱藏,不會(huì)影響用戶的交互,在讀屏軟件中不會(huì)被識別。
.hide()
這個(gè)方法不接受任何參數(shù)。
.hide( [duration ] [, complete ] )
duration (默認(rèn): 400)
類型: Number or String
一個(gè)字符串或者數(shù)字決定動(dòng)畫將運(yùn)行多久。
complete
類型: Function()
在動(dòng)畫完成時(shí)執(zhí)行的函數(shù)。
如果沒有參數(shù),.hide()方法是最簡單的方法來隱藏一個(gè)元素:
$('.target').hide();
匹配的元素將被立即隱藏,沒有動(dòng)畫。這大致相當(dāng)于調(diào)用.css('display', 'none'),但display屬性值保存在jQuery的數(shù)據(jù)緩存中,所以display可以方便以后可以恢復(fù)到其初始值。如果一個(gè)元素的display屬性值為inline,那么隱藏再顯示時(shí),這個(gè)元素將再次顯示inline。
1、使用display:none來隱藏所有內(nèi)容
display:none可以讓網(wǎng)頁中所有內(nèi)容不顯示,如代碼、文字、鏈接、圖片、div層,是推薦的內(nèi)容隱藏方式。
<div style="display:none;">;我不占地兒,你看不見我;</div>
2、使用visibility:hidden來隱藏內(nèi)容
visibility:hidden和display:none可以隱藏的內(nèi)容幾乎一樣,但唯一區(qū)別是它雖然隱藏了內(nèi)容,但被隱藏掉的內(nèi)容仍舊占據(jù)空間,這段隱藏了內(nèi)容卻保留空間的位置會(huì)在網(wǎng)頁中顯示為空白。
<div style="visibility:hidden;">;我占了地兒,你也看不見我;</div>
3、使用overflow:hidden隱藏溢出內(nèi)容
overflow:hidden這種方式可以隱藏掉固定區(qū)域外的內(nèi)容,它可以有效控制顯示區(qū)域。但應(yīng)注意,使用它時(shí)需要給它定義寬度和高度,否則會(huì)無效。
<div style="width:120px; height:20px; overflow:hidden;">;我占的地兒太多了你就看不見我的尾巴了。。。。。</div>overflow用法中存在一個(gè)分支,overflow-x:hidden和overflow-y:hidden,x是橫向范圍,y是縱向范圍,這兩個(gè)屬性經(jīng)常用在需要隱藏滾動(dòng)條時(shí)。
聲明:本網(wǎng)站尊重并保護(hù)知識產(chǎn)權(quán),根據(jù)《信息網(wǎng)絡(luò)傳播權(quán)保護(hù)條例》,如果我們轉(zhuǎn)載的作品侵犯了您的權(quán)利,請?jiān)谝粋€(gè)月內(nèi)通知我們,我們會(huì)及時(shí)刪除。
蜀ICP備2020033479號-4 Copyright ? 2016 學(xué)習(xí)鳥. 頁面生成時(shí)間:2.969秒