notTarget和z-index的問題
? ?1. .bg:not(:target) 這句代碼是什么意思,是不是縮寫了?什么時候觸發?是點別的img的時候嗎?
? ? 2.z-index的問題。如果沒有:not(:target)的代碼,切換點擊縮略圖時,動畫展示時的底層圖片總是最后一張圖;但有了這個代碼,切換時底層圖片是上一次點擊的圖片。這是為什么呢?
? ?1. .bg:not(:target) 這句代碼是什么意思,是不是縮寫了?什么時候觸發?是點別的img的時候嗎?
? ? 2.z-index的問題。如果沒有:not(:target)的代碼,切換點擊縮略圖時,動畫展示時的底層圖片總是最后一張圖;但有了這個代碼,切換時底層圖片是上一次點擊的圖片。這是為什么呢?
2018-06-09
舉報
2018-06-30
1、.bg:not(:target),意思是所有沒被觸發的選擇器的樣式,:not(條件),非括號里面的類型。
通過點擊錨點類似a<a href="#bg1"></a>觸發,鏈接到id為bg1的元素。
例如你點擊了第一個,那么其他4個img就是.bg:not(:target),第一個就是#bg1:target。這樣第一個圖片通過入場動畫顯示出來,其他四個因為img.bg設置了z-index為1,層級在下面,就會被第一個的z-index:100覆蓋。
2、同第一個圖片,z-index是顯示的層級??梢岳斫鉃閤、y構成二維平面,那么z就是第3維,就像我們很多放在一起的紙的順序。