Rumah >hujung hadapan web >tutorial css >Bagaimanakah saya boleh mengutamakan lokasi pemisah baris tertentu dalam HTML tanpa menggunakan
atau ruang yang tidak pecah? " />
Menentukan Lokasi Pemisah Talian Pilihan
Dalam HTML, pemisah baris biasanya berlaku pada ruang atau koma. Walau bagaimanapun, dalam situasi di mana anda ingin memaksa pemisah baris di lokasi tertentu, terdapat teknik untuk mengutamakan rehat pilihan.
Untuk menetapkan lokasi putus baris pilihan tanpa menggunakan ruang tanpa putus, anda boleh menggunakan pendekatan berikut:
Tentukan kelas CSS:
<code class="css">span.avoidwrap { display: inline-block; }</code>
Balut teks untuk disimpan bersama dalam kelas ini:
<code class="html"><span class="avoidwrap">Text to keep together</span></code>
Ini kaedah menetapkan teks yang dibalut sebagai blok sebaris, menghalangnya daripada pecah dalam sempadannya sendiri Algoritma pembalut baris akan mula-mula cuba memecahkan di lokasi pilihan yang ditentukan (cth., koma) sebelum mempertimbangkan ruang dalam blok sebaris.
Contohnya, coretan kod berikut:
<code class="html"><html> <head> <style type="text/css"> span.avoidwrap { display: inline-block; } </style> </head> <body> <div class="box"> <table> <tr> <td>lorem ipsum</td> <td>lorem ipsum</td> <td>lorem ipsum</td> </tr> <tr> <td>lorem ipsum</td> <td> <span class="avoidwrap">Honey Nut Cheerios, Wheat Chex, Grape-Nuts, Rice Krispies</span> <br /> <span class="avoidwrap">Some random cereal with a very long name, Honey Bunches of Oats, Wheaties, Special K</span> <br /> <span class="avoidwrap">Froot Loops, Apple Jacks</span> </td> <td>lorem ipsum</td> </tr> </table> </div> </body> </html></code>
Akan mengakibatkan pemisah baris dibuat di lokasi koma yang ditetapkan, mengekalkan teks dalam setiap blok sebaris bersama-sama.
Atas ialah kandungan terperinci Bagaimanakah saya boleh mengutamakan lokasi pemisah baris tertentu dalam HTML tanpa menggunakan