我們?cè)趯W(xué)習(xí)web前端技術(shù)的時(shí)候，css樣式的知識(shí)是少不了的，關(guān)于css樣式的知識(shí)點(diǎn)有很多，本期小編為大家介紹一下web前端培訓(xùn)教程：CSS怎樣控制元素的顯示與隱藏?

　　web前端培訓(xùn)教程：CSS怎樣控制元素的顯示與隱藏?

　　瀏覽網(wǎng)頁(yè)時(shí)，常常會(huì)有網(wǎng)站廣告，當(dāng)我們點(diǎn)擊關(guān)閉就不見(jiàn)了，但是我們重新刷新頁(yè)面，會(huì)重新出現(xiàn)。這種效果本質(zhì)上是讓一個(gè)元素在頁(yè)面中隱藏或者顯示出來(lái)。

　　display 顯示隱藏

　　visibility 顯示隱藏

　　overflow 溢出顯示隱藏

　　display 屬性

　　display 屬性用于設(shè)置一個(gè)元素應(yīng)如何顯示。

　　display: none ;隱藏對(duì)象

　　display：block ;除了轉(zhuǎn)換為塊級(jí)元素之外，同時(shí)還有顯示元素的意思

　　display 隱藏元素后，不再占有原來(lái)的位置。 后面應(yīng)用及其廣泛，搭配JS 可以做很多的網(wǎng)頁(yè)特效。

　　visibility 可見(jiàn)性

　　visibility屬性用于指定一個(gè)元素應(yīng)可見(jiàn)還是隱藏。

　　visibility：visible ; 元素可視

　　visibility：hidden; 元素隱藏

　　visibility 隱藏元素后，繼續(xù)占有原來(lái)的位置。 如果隱藏元素想要原來(lái)位置，就用visibility：hidden 如果隱藏元素不想要原來(lái)位置，就用display：none (用處更多重點(diǎn))

　　overflow 溢出

　　一般情況下，我們都不想讓溢出的內(nèi)容顯示出來(lái)，因?yàn)橐绯龅牟糠謺?huì)影響布局。

　　但是如果有定位的盒子，請(qǐng)慎用overflow:hidden因?yàn)樗鼤?huì)隱藏多余的部分。

　　注意：

　　display 顯示隱藏元素但是不保留位置

　　visibility 顯示隱藏元素但是保留原來(lái)的位置

　　overflow 溢出顯示隱藏但是只是對(duì)于溢出的部分處理

　　以上就是為大家介紹的關(guān)于“CSS怎樣控制元素的顯示與隱藏”的內(nèi)容，希望能夠給大家?guī)?lái)幫助，想要了解更多的web前端培訓(xùn)班、課程、價(jià)格、試聽(tīng)等信息，請(qǐng)您留下聯(lián)系方式，千鋒教育課程顧問(wèn)會(huì)盡快聯(lián)系您，為您定制專屬課程，開(kāi)始您的學(xué)習(xí)之旅。