Chrome Geliştirici Araçları: Bir CSS kuralını geçersiz kılan öğeyi nasıl öğrenebilirim?

196

Bu oldukça basit. Chrome'un Geliştirici Araçları bana bir stilin geçersiz kılındığını gösteriyorsa, hangi CSS kuralının geçersiz kıldığını nasıl görebilirim?

"Bana neyi geçersiz kıldığını göster" gibi bir şey olup olmadığını bilmek istiyorum .

OBS: Lütfen beni Firebug'a yöneltme.

— Ramon K.
kaynak

Chrome'un Geliştirici Araçları ayrıca size öncelikli kuralı da gösterir

— Zoltan Toth

Yanıtlar:

284

Eleman denetçisinin Hesaplanan Stil panelini kullanın . Geçerli kuralların listesini ve hangisinin kazandığını görmek için ilgili mülkü genişletin.

Chrome ekran görüntüsü

— josh3736
kaynak

Benim için hesaplanan sekme varsayılan olarak açıktı ve bu nedenle sekme olarak listelenmiyordu, 'Hesaplanmış' bir başlığına sahip olmalıydı, aksi takdirde uzun bir süre bekleyebilirsiniz.

— MrFox

Chrome ilerledikçe teknik biraz değişti. 'İlgilenilen özelliği genişlet' yerine, özelliğin yanındaki casus cama tıklayın ve Stiller sekmesinde hangi stilin geri kazandığını gösterecektir.

— 15:42

@ intotecho: Chrome 47, büyüteç değişikliği emildiği için Hesaplanmış sekmesindeki genişletmeyi geri yükledi. crbug.com/496263

— josh3736

TÜMÜ iptal edilirse ne olur? Muhtemelen bir senaryo yüzünden mi? Kimin yaptığını nasıl buluyorsun?

— darkgaze

Hala Elements panelindeki "Computed" sekmesi olarak oradadır.

— josh3736

Sadece aynı isme sahip olmayanlara bakabilirsiniz, listenin önemini unutmayın.

Veya hesaplanan stilleri görüntüleyebilirsiniz. Aslında uygulanan stiller olacaklar.

— user1902091
kaynak

crtrl + üst karakter + c tuşlarına basın ve öğeyi inceleyin. Ardından, sağ alt köşedeki kutuda çizgisi olmayan bir stil bulun.

geçersiz kılma çoğu durumda en üsttedir (ve bu stil "kazanan" olan bir çizgi olmadan).

— Peter Rasmussen
kaynak

Bir stil önemli olarak işaretlendiğinde durum böyle değil!

— JCorriveau