css中的display顯示與隱藏屬性

2021-09-25 06:31:06 字數 909 閱讀 8894

通常預設html內容是顯示,但有時我們想前期他隱藏,滑鼠經過乙個觸發地方,便顯示被隱藏內容,這個時候開始時候我們運用display:none,當滑鼠經過觸發地方時,js對應呼叫display:block樣式的css顯示內容。

我們用css偽類隱藏案例:

1、**如下

這是沒有隱藏

2、然後給這個div新增css display:none隱藏屬性

3、最後做乙個滑鼠放在上面顯示效果

(因為截圖原因滑鼠消失了,所以看不到滑鼠放上去的效果)

這裡特別要說明使用display:none是比較方便的隱藏物件內容方法,比如他們在網頁插入第三方統計時候,便會顯示cnzz的圖示或文字內容,為了又統計網頁**訪問流量,又要通過css隱藏掉,我們即可以使用此樣式實現;對於一些seo來說隱藏鏈結,使用display:none將是乙個錯誤選擇,無論display:none是在html標籤內使用還是,css檔案引入,搜尋引擎都會識別你使用此屬性,搜尋引擎也不會讀取或索引你此樣式裡的內容。

CSS屬性 display 顯示屬性

演示示例 visibility 屬性?該css屬性用來設定物件如何顯示。的預設值都為 inline。值 block none inline inline block list item table header group table footer group inherit 可用值值的說明 blo...

CSS樣式 顯示模式display

顯示模式共三種 block inline inline block 第一種 block 塊級元素 常見塊級元素 div h1 h6 p ul ol li,其中div元素經常被當做布局元素使用 塊級元素的特點 所有的塊級元素自己占用一行,無論寬度是多少 塊級元素可以設定寬度 width 和高度 hei...

CSS屬性中Display與Visibility

visibility屬性是隱藏元素但保持元素的浮動位置,而display實際上是設定元素的浮動特徵。visibility屬性用來確定元素是顯示還是隱藏,這用visibility visible hidden 來表示,visible表示顯示,hidden表示 僅 隱藏,不可恢復。當visibility...