CSS中hover的使用細節

2021-10-08 14:11:11 字數 498 閱讀 7561

元素新增hover偽類選擇器時候一定要緊貼hover,不能有空格,有空格的話表示給該元素的所有子元素設定裡hover樣式

錯誤例子:

ul :hover{} //ul的所有子元素設定了hover樣式
正確例子:

ul:hover{} // ul會顯示出想要的效果
想要在父元素新增hover,在指定的子元素實現效果

子元素應該寫在hover後面空格隔開

這個例子中當滑鼠經過ul的時候,li會在設定的角度旋轉

⚠️注意:僅可以給自身的子元素設定樣式,給其他元素子元素設定無效

接著上文舉例子:

div:hover .one{}  //不顯示任何效果,hover失效

css中hover的妙用!!

css 中有個屬性為hover 當滑鼠放上的時候,將其啟用,可以實現類似於js的一些,譬如選單等功能 22.html檔案 dddddddddddddd terry 11.css檔案。div dd div dd hover 說明 a link 未訪問的鏈結 a visited 已訪問的鏈結 a hov...

css中hover的妙用!!

css 中有個屬性為hover 當滑鼠放上的時候,將其啟用,可以實現類似於js的一些,譬如選單等功能 22.html檔案 dddddddddddddd terry 11.css檔案。div dd div dd hover 說明 a link 未訪問的鏈結 a visited 已訪問的鏈結 a hov...

CSS中hover選擇器的使用詳解

有些時候需要用到mouseover和mouseout這兩個滑鼠事件,但是寫js又比較麻煩,還要新增監聽事件,所以能用css解決的東西盡量yongcss解決,這樣可以提高效能,下面說一下我對 hover 的了解 之前在學計算機應用的時候,老師教我們使用了 hover選擇器來完成下拉列表,之前只知道怎麼...