kenapa

Cara kerja
penampil HTML.

Edit HTML dan lihat hasilnya di browser. Berikut cara kerja pratinjau, draf, dan berbagi tautan.

Penampil HTML menyatukan editor dan pratinjau dalam satu ruang kerja. Buka file, tempel kode, periksa konsol, lalu unduh atau bagikan sumbernya.

Apa itu penampil HTML?

Penampil HTML menampilkan HTML sebagai halaman web. Alat ini diperbarui saat Anda mengetik, sehingga Anda bisa memeriksa cuplikan tanpa membuat proyek. CSS dalam <style> dan JavaScript dalam <script> dapat dijalankan; JSX dan bahasa sisi server harus diubah menjadi HTML terlebih dahulu.

Cara kerja penampil HTML

Dokumen dirender dalam iframe dengan sandbox. Skrip dapat berjalan, tetapi pratinjau tidak dapat membaca halaman induk atau mengalihkan tab Anda. Gambar, gaya, skrip, dan permintaan eksternal tetap dapat menghubungi servernya sendiri.

Render tidak mengunggah kode sumber kepada kami. Permintaan dokumen tetap mengikuti aturan browser seperti CORS. Tautan memuat HTML terkompresi; panjangnya bergantung pada dokumen. Untuk tautan yang sangat panjang, lebih baik bagikan file.

Penampil HTML versus CodePen, JSFiddle, atau berkas lokal

CodePen dan JSFiddle menyediakan tempat untuk bereksperimen dengan kode secara online. Bandingkan opsi penyimpanan proyek dan panel kodenya jika Anda memerlukan lebih dari satu dokumen HTML.

Membuka file HTML lokal cocok jika Anda sudah memiliki filenya. Gambar dan gaya relatif harus tersedia pada jalur yang digunakan. Untuk proyek dengan proses build atau API, gunakan server pengembangan proyek tersebut.

HTML Viewer Cat ditujukan untuk mengedit dan melihat hasil dengan cepat. Tidak perlu membuat akun. Draf lokal menyimpan pekerjaan di browser ini; unduhan HTML memberi Anda file untuk disimpan di tempat lain.

Ruang kerja

Editor dan pratinjau memenuhi jendela. Buka konsol untuk membaca log dan pesan kesalahan, atau pilih contoh dari bilah bawah.

Mengedit dan menguji

Aktifkan mode Live untuk melihat perubahan saat mengetik, atau jeda lalu tekan Jalankan saat skrip siap. Pada layar lebar, bingkai perangkat menguji lebar viewport; bingkai tidak meniru browser lain atau aplikasi email.

Editor mendukung pewarnaan sintaks, pencarian, pelipatan kode, dan Urungkan. Format menggunakan Prettier. Geser pembatas untuk mengubah ukuran panel. Tautan berisi sumber HTML; nilai formulir dan status JavaScript dalam pratinjau tidak disimpan.

Penggunaan dan penyimpanan

Dibuat dan dirawat oleh Axel, pengembang mandiri di Norwegia.