Web Sayfası Öğelerini Nasıl Denetlerim?

Herhangi Bir Web Sayfasının HTML ve CSS'sine bakın

Web sitesi kod satırları ile oluşturulmuştur, ancak sonuç resim, video, yazı tipi ve daha fazlası olan belirli sayfalardır. Bu unsurlardan birini değiştirmek veya neyin içerdiğini görmek için, onu kontrol eden özel kod satırını bulmanız gerekir. Bunu bir eleman inceleme aracıyla yapabilirsiniz.

Çoğu web tarayıcısı sizi bir inceleme aracı indirmenize veya bir eklenti yüklemenize neden olmaz. Bunun yerine, sayfa öğesini sağ tıklatıp Öğeyi İnceleme veya İnceleme'yi seçmenize izin verirler. Ancak, işlem tarayıcınızda biraz farklı olabilir.

Chrome'da Elemanları İnceleyin

Google Chrome'un en yeni sürümleri, sayfayı birkaç şekilde incelemenize olanak tanır. Bunların tümü, yerleşik Chrome DevTools'unu kullanır:

Chrome DevTools, HTML satırlarını kolayca kopyalamak veya düzenlemek veya öğeleri tamamen gizlemek veya silmek (sayfa yeniden yüklenene kadar) gibi işlemleri yapmanıza olanak tanır.

DevTools sayfanın kenarında açıldığında, nerede konumlandırılacağını değiştirebilir, sayfanın dışına çıkartabilir, tüm sayfaların dosyalarını arayabilir, belirli inceleme, dosya ve URL’leri kopyalamak için sayfadan öğeleri seçebilir ve hatta bir grubu özelleştirebilirsiniz. ayarların

Firefox'ta Elemanları İncele

Chrome gibi, Firefox'un Inspector adlı aracını açmanın birkaç farklı yolu var:

Farenizi Firefox'taki çeşitli öğelerin üzerine getirdiğinizde, Inspector aracı otomatik olarak öğenin kaynak kodu bilgilerini bulur. Bir öğeyi tıklayın ve "anında arama" duracak ve öğeyi Inspector penceresinden inceleyebilirsiniz.

Desteklenen tüm denetimleri bulmak için bir öğeye sağ tıklayın. Sayfayı HTML olarak düzenlemek, iç veya dış HTML kodunu kopyalamak veya yapıştırmak, DOM özelliklerini, ekran görüntüsünü göstermek veya düğümü silmek, yeni öznitelikleri kolayca uygulamak, sayfanın tüm CSS'lerini görmek ve daha fazlasını yapmak gibi şeyler yapabilirsiniz.

Operadaki Elemanları İnceleyin

Opera, Chrome'la aynı olan DOM Inspector aracıyla öğeleri de denetleyebilir. Buna nasıl ulaşılacağı:

Internet Explorer'da Elemanları İncele

Internet Explorer'da Geliştirici Araçları adı verilen benzer bir inceleme aracı kullanılabilir:

IE, bu yeni menüde, HTML ve CSS ayrıntılarını görmek için herhangi bir sayfa öğesini tıklamanızı sağlayan bir Select öğesi aracına sahiptir. Ayrıca, DOM Gezgini sekmesinde gezerken öğenin vurgulanmasını kolayca devre dışı bırakabilir / etkinleştirebilirsiniz.

Yukarıdaki tarayıcılarda bulunan diğer öğe denetleyici araçları gibi, Internet Explorer HTML'yi düzenlemenin yanı sıra öğeleri düzenlemenize, kopyalamanıza ve yapıştırmanıza, öznitelikler eklemenize, ekli stilleri olan öğeleri kopyalamanıza ve daha fazlasını yapmanıza olanak tanır.