Geliştirici / HTML

HTML Görüntüleyici: CSS ve JavaScript ile Canlı Yalıtılmış Önizleme

Canlı ve yalıtılmış bir önizleme görmek için HTML'yi ve isteğe bağlı CSS'yi yapıştırın. JavaScript'i açıkça etkinleştirin, önizlemeyi tam ekrana genişletin veya HTML önizleme dosyasını indirin.

HTML Görüntüleyici: CSS ve JavaScript ile Canlı Yalıtılmış Önizleme: Kaynağı opak kökene sahip yalıtılmış bir çerçevede oluşturur. Komut dosyaları başlangıçta devre dışıdır. İçerik güvenlik politikası; satır içi stillere ve veri görsellerine izin verirken harici kaynakları, fetch isteklerini, formları ve gömülü sayfaları engeller. Sayfayı yenileyebilen meta verileri, base öğelerini ve gömülü tarama bağlamlarını kaldırır. İndirme, yalıtılmış çerçeveyi korur. Sunucuya hiçbir dosya yüklenmeden tarayıcınızda %100 yerel olarak çalışır.

Çalıştırma sayısı
Tarayıcınızda
Maliyet
Ücretsiz · kayıt gerekmez
Kullanılabilirlik
Kullanıma hazır
HTML görüntüleyiciYerel işleme

Tamamen tarayıcınızda çalışır

Önizleme bu siteden yalıtılmıştır. Komut dosyaları varsayılan olarak kapalıdır. Harici stiller, komut dosyaları, görseller, fetch istekleri, formlar ve gömülü sayfalar engellenir; satır içi stillere ve veri görsellerine izin verilir. Komut dosyalarını etkinleştirmek, önizlemeye yapıştırdığınız kodu çalıştırır.

Canlı önizleme

İndirilen HTML aynı yalıtılmış önizlemeyi açar. Bu sayfaya kaynak eklenmez.

Çerçeve yalıtımı

WHATWG HTML standardı, iframe sandbox kısıtlamalarını tanımlar (https://html.spec.whatwg.org/multipage/iframe-embed-object.html#attr-iframe-sandbox). Bu önizleme hiçbir zaman allow-same-origin izni vermez.

İçerik kısıtlamaları

W3C Content Security Policy spesifikasyonu, kaynak kısıtlamalarını tanımlar (https://www.w3.org/TR/CSP3/). Önizleme, sağlanan işaretlemeyi uygulamadan önce kısıtlayıcı bir politika uygular. İndirilen kapsayıcısı sandbox sınırını korur.

Nasıl kullanılır?

  1. HTML'yi ve isteğe bağlı CSS'yi veya JavaScript'i yapıştırın.
  2. Yapıştırdığınız kodun yalıtılmış önizlemede çalışmasını istediğinizde komut dosyalarını etkinleştirin.
  3. Canlı ya da tam ekran önizlemeyi inceleyin, ardından yalıtılmış önizleme dosyasını indirin.

Gizlilik ve sınırlamalar

Girdileriniz ve dosyalarınız tarayıcınızda işlenir. Hiçbir şey yüklenmez.

İlgili araçlar

Sık sorulan sorular

Önizlemem bu sitenin çerezlerine veya sayfasına erişebilir mi?

Yalıtılmış alan, aynı kökene erişim sağlamaz. Yapıştırılan kod bu sitenin DOM'una veya depolama alanına erişemez. Komut dosyaları yalnızca onları etkinleştirdiğinizde çalışır.

Harici görseller veya kitaplıklar neden yüklenmiyor?

Yerel önizleme uzak kaynakları engeller. Stilleri ve komut dosyalarını doğrudan düzenleyicilere ekleyin, görseller için data URL'leri kullanın.

Eksiksiz bir HTML belgesi yapıştırabilir miyim?

Evet. Önizleme, eksiksiz belgeleri ve parçaları kabul eder. Meta verileri ve gömülü tarama bağlamlarını kaldırır, kendi içerik güvenlik politikasını uygular ve sonucu yalıtılmış çerçevede oluşturur.

İndirilen dosyada ne bulunur?

Kaynağınızı aynı yalıtılmış alanın içinde açan bir HTML dosyası içerir. Bu, kaynağın doğrudan sıradan bir sayfaya yapıştırıldığı dosya değil, önizleme dosyasıdır.

Ücretsiz araç · tarayıcınızda kez çalıştırma · hesap gerekmez