Alat pembangun · HTML WYSIWYG editor
Enter vs Shift+Enter: Cara Editor Memilih Antara <p>, <div> dan <br>
· Bagaimana ia berfungsi
html boleh diedit kandungan penyuntingan teks
Terangkan model perenggan di sebalik editor pelayar: mengapa Enter boleh mencipta <p> atau <div>, sebab Shift+Enter memasukkan <br> dan bagaimana ia menentukan jarak anda.
Mengapa jarak jarak salah dalam CMS tetapi baik dalam editor — dibuka dengan masalah dua jurang atau tiada jurang klasik
Jarak yang kelihatan selesa dalam editor boleh berubah apabila serpihan memasuki CMS kerana blok menerima jidar daripada helaian gaya destinasi. Dua perenggan dan dua baris yang dipisahkan oleh br adalah berbeza dari segi struktur walaupun satu pratonton berlaku untuk memberikan jarak menegak yang serupa.
ToolAcre mendedahkan perbezaan sumber itu. Ia tidak membawa jidar yang disalin atau gaya sebaris, jadi jarak perenggan datang daripada pembalut pratonton atau destinasi kemudiannya CSS. Penulis harus memilih struktur mengikut makna dan mengesahkan elemen bersiri dan bukannya menambah ketukan kekunci kosong sehingga satu paparan sementara kelihatan betul.
Sekat berbanding pemisah sebaris — menerangkan bahawa <p> dan <div> ialah blok dengan jidarnya sendiri, manakala <br> ialah pemisah baris di dalam blok
Perenggan dan div ialah bekas blok; br ialah elemen pemisah garisan kosong di dalam aliran lain. Editor ini membenarkan p dan br tetapi tidak div. Div yang ditampal dibuka, mengekalkan perkataannya dan membenarkan keturunan sambil membuang pembalut. Br yang telah disanitasi dipancarkan sebagai `<br />`.
Alamat pos boleh menjadi satu perenggan dengan pemutusan baris yang disengajakan kerana barisnya membentuk satu unit. Dua pemikiran bebas lebih baik diwakili sebagai dua perenggan. Destinasi boleh menggayakan margin p secara konsisten, manakala elemen br berulang digunakan sebagai pengatur jarak menegak mengekod penampilan terus ke dalam kandungan.
Perkara yang Enter lakukan di sini adalah bergantung kepada pelayar dan tidak dikonfigurasikan oleh ToolAcre
ToolAcre tidak menetapkan perintah pemisah perenggan lalai atau memintas Enter. Pelayar boleh diedit kandungan mengendalikan kunci, dan pendengar input menyegarkan output selepas itu. Had repositori memberi amaran bahawa tingkah laku enjin berbeza, jadi menegaskan bahawa Enter sentiasa mencipta p, sentiasa mencipta div atau mengikut satu peraturan khusus versi akan menjadi panduan keserasian.
Langkah sanitasi kemudian menyempitkan apa sahaja siri yang tiba. Div yang dibuat oleh pelayar tidak dapat bertahan sebagai div, walaupun teksnya boleh kekal. Ini mungkin menjadikan sumber akhir berbeza sekali lagi daripada pokok perantaraan hidup. Oleh itu, mod sumber adalah tempat untuk mewujudkan elemen p eksplisit apabila makna perenggan stabil penting.
Cuti lembut boleh ditulis dalam sumber, tetapi tiada kontrak Shift+Enter dilaksanakan
Bar alat tidak mempunyai butang "patah lembut" dan kod tidak mendaftar Shift+Enter. Pelayar mungkin melaksanakan gerak isyarat itu, tetapi artikel ini tidak menjanjikan outputnya. Mod sumber boleh mengekalkan br yang dibenarkan, menyediakan cara yang pasti untuk menyatakan rehat dalam perenggan selepas memeriksa hasil visual.
Tingkah laku papan kekunci juga bergantung pada pemilihan dan keadaan pengeditan bahawa modul tidak menguji. Gunakan pelayar tepat yang terlibat dalam kerja anda, kemudian baca sumber. Jika gerak isyarat menghasilkan blok yang tidak diingini, tulis semula serpihan itu secara eksplisit dan bukannya bergantung pada perihalan pintasan yang disalin daripada rangka kerja editor lain.
Contoh yang berjaya: bina alamat dan nota, kemudian periksa daripada meramal
Untuk alamat, gunakan mod sumber untuk membuat satu p dengan br antara penerima, jalan dan lokaliti. Untuk nota ringkas, buat dua elemen p. Kembali ke mod visual, di mana sumber dibersihkan sebelum dimasukkan, dan bandingkan pratonton tanpa mengandaikan marginnya sepadan dengan tapak web akhir.
Kemudian salin HTML dan periksa serpihan secara berasingan daripada Muat Turun HTML. Hasil yang disalin mengandungi markup badan yang telah dibersihkan; muat turun mengandungi dokumen lengkap dengan pratonton ToolAcre CSS. Perbezaan ini boleh menjelaskan sebab membuka fail yang dimuat turun kelihatan lebih lengkap daripada menampal serpihan yang disalin ke dalam sistem dengan gaya yang berbeza.
Perenggan kosong dan ruang tidak putus dikekalkan sahaja apabila disokong oleh penulis semula
Perenggan kosong yang dibenarkan boleh kekal kerana p diterima dan tiada peraturan memadamkan blok kosong. Entiti bukan-pecah-ruang yang diketahui boleh menjadi wataknya yang dinyahkod dan kemudiannya dilepaskan mengikut pelaksanaan entiti tempatan; kod tidak menyediakan peraturan pembersihan yang menyasarkan perenggan spacer secara khusus.
Oleh itu, "Sanitise sekarang" bukan pembersih susun atur. Ia mengalih keluar penanda dan atribut yang tidak disokong, mengimbangkan teg dan sumber format, tetapi ia boleh mengekalkan kekosongan yang dibenarkan secara struktur. Padamkan artifak jarak dengan sengaja dalam mod sumber atau visual dan biarkan destinasi CSS membekalkan margin biasa dan bukannya mengumpul blok kosong.
Perkara yang tidak dilindungi ini — CSS peraturan keruntuhan jidar atau konfigurasi rangka kerja editor
Artikel ini tidak merangkumi keruntuhan jidar, konfigurasi pemisah rangka kerja, matriks papan kekunci pelayar demi pelayar atau ciri-ciri jarak e-mel. Ia juga tidak mendakwa bahawa pratonton menghasilkan semula CMS. Kotak pasir ringan menggunakan fon badannya sendiri, ketinggian garisan, pelapik dan gelagat putus.
Ia juga tidak menganggap keluaran yang ditapis sebagai penerbitan yang selamat secara universal. Penyerahan berniat jahat memerlukan pembersihan bahagian pelayan yang sesuai dengan destinasi, walaupun pratonton tempatan pakai buang kekal lengai. Semantik perenggan, tingkah laku penyuntingan pelayar dan dasar keselamatan adalah tiga kebimbangan berasingan yang tidak boleh diruntuhkan ke dalam satu ujian "nampak betul".
Bawa pulang: pilih rehat yang sepadan dengan maksud — meringkaskan model dan cara editor ToolAcre HTML WYSIWYG membolehkan anda menyemak elemen yang dihasilkan oleh setiap kunci
Pilih pemecahan yang sepadan dengan kandungan, tetapi sahkan daripada meramalkan tekanan kekunci. ToolAcre memberikan akses sumber langsung, menerima p dan br, membuka div dan menunjukkan pemaparan kotak pasir. Fakta tersebut menyokong aliran kerja berulang tanpa mencipta janji tentang Enter atau Shift+Enter.
Bina alamat dan nota kecil, tukar mod dua kali, dan pastikan struktur yang dimaksudkan bertahan dalam sanitasi. Jika destinasi menggunakan jurang yang mengejutkan, periksa CSSnya dan bukannya memasukkan lebih banyak HTML yang kosong. Maksud stabil bergerak lebih baik daripada jarak yang ditala pada satu pratonton terpencil.