Tarayıcınızla Web Öğelerini İnceleme

Web siteleri kod satırlarından oluşturulur, ancak sonuçlar resimler, videolar, yazı tipleri ve diğer özellikleri içeren sayfalardır. Bu öğelerden birini değiştirmek veya nelerden oluştuğunu görmek için, onu kontrol eden kod satırını bulun. Bunu yapmak için bir eleman inceleme aracı kullanın. Favori web tarayıcınız için bir denetim aracı indirmeniz veya bir eklenti kurmanız gerekmez. Bunun yerine, sayfa öğesini sağ tıklayın ve ardından Denetlemek or Eleman incelemek. Ancak bu araca nasıl erişeceğiniz tarayıcıya göre değişir.

Bu makalede sağ tıklatın Windows PC'deki fare cihazı eylemine ve Mac'teki Control + tıklama eylemine başvurmak için.

Google Chrome'da Öğeleri İnceleyin

Google Chrome'da, tarayıcının yerleşik Chrome Geliştirme Araçlarını kullanarak bir web sayfasını incelemenin iki yolu vardır:

  • Sayfadaki veya boş bir alandaki bir öğeyi sağ tıklayın ve ardından Denetlemek.
  • Git krom menü, ardından seçin Diğer Araçlar > Geliştirici Araçları.

Köprü Metni Biçimlendirme Dili (HTML) biçimlendirmesini kopyalamak veya düzenlemek ve sayfa yeniden yüklenene kadar öğeleri gizlemek veya silmek için Chrome Geliştirme Araçlarını kullanın.

Chrome DevTools sayfanın yan tarafında açıldığında, konumunu değiştirin, sayfanın dışına çıkarın, sayfa dosyalarını arayın, daha yakından bakmak için sayfadaki öğeleri seçin, dosyaları ve URL'leri kopyalayın ve ayarları özelleştirin.

Mozilla Firefox'ta Öğeleri İnceleyin

Mozilla Firefox'un Inspector adlı denetleme aracını açmanın iki yolu vardır:

  • Web sayfasındaki bir öğeyi sağ tıklayın ve ardından Eleman incelemek.
  • Firefox menü çubuğundan Araçlar > Web Geliştirici > Müfettiş.

İmleci Firefox'ta öğelerin üzerine getirdiğinizde, Inspector öğenin kaynak kodu bilgilerini otomatik olarak bulur. Bir öğe seçtiğinizde, anında arama durur ve öğeyi Denetleyici penceresinden inceleyebilirsiniz.

Desteklenen kontrolleri bulmak için bir öğeyi sağ tıklayın. Sayfayı HTML biçimlendirmesi olarak düzenlemek, iç veya dış HTML biçimlendirmesini kopyalamak veya yapıştırmak, Belge Nesne Modeli (DOM) özelliklerini göstermek, düğümün ekran görüntüsünü almak veya silmek, yeni nitelikler uygulamak, Basamaklı Stil Sayfalarına (CSS) bakın. , ve dahası.

Safari'de Öğeleri İnceleyin

Safari'de web öğelerini incelemenin birkaç yolu vardır:

  • Bir web sayfasındaki herhangi bir öğeyi veya alanı sağ tıklayın ve ardından Eleman incelemek.
  • Git Geliştirmek menü, ardından seçin Web Denetçisini Göster.

Geliştirme menüsünü görmüyorsanız, safari menüsünü seçin ve Tercihler. On gelişmiş sekmesine gidin, Menü çubuğunda Geliştir menüsünü göster onay kutusunu işaretleyin.

Bu bölüme ayrılan işaretlemeyi görmek için web sayfasındaki tek tek öğeleri seçin.

Internet Explorer'da Öğeleri İnceleyin

Geliştirici Araçları etkinleştirilerek erişilen benzer bir inceleme öğesi aracı, Internet Explorer'da mevcuttur. Geliştirici Araçlarını etkinleştirmek için, F12. Veya şuraya gidin: Araçlar menüsünü seçin ve Geliştirici Araçları.

Araçlar menüsünü görüntülemek için Alt + X.

Bir web sayfasındaki öğeleri incelemek için sayfayı sağ tıklayın ve ardından Eleman incelemek. Internet Explorer Öğe Seç aracından, HTML veya CSS işaretlemesini görmek için herhangi bir sayfa öğesini seçin. DOM Gezgini'nde gezinirken öğe vurgulamayı da devre dışı bırakabilir veya etkinleştirebilirsiniz.

Diğer öğe denetleme araçları gibi, öğeleri kesmek, kopyalamak ve yapıştırmak, ayrıca HTML biçimlendirmesini düzenlemek, nitelikler eklemek, öğeleri eklenmiş stillerle kopyalamak ve daha fazlası için Internet Explorer'ı kullanın.

Microsoft Edge'de Öğeleri İnceleyin

Microsoft Edge'deki öğeleri inceleyebilmeniz için incelemeyi etkinleştirmeniz gerekir. İncelemeyi etkinleştirmenin iki yolu vardır:

  • Adres çubuğuna gidin ve girin about: bayrakları. İletişim kutusunda, Bağlam menüsünde Kaynağı Görüntüle ve Öğeyi İncele'yi Göster onay kutusunu işaretleyin.
  • Basın F12Ardından seçmek DOM Gezgini.

Bir öğeyi incelemek için web sayfasındaki bir öğeyi sağ tıklayın ve ardından Eleman incelemek.