Bagaimana untuk Menggunakan Titik Putus dan Pertanyaan Media Dengan Utiliti 'limpahan' dalam Tailwind?

Bagaimana Untuk Menggunakan Titik Putus Dan Pertanyaan Media Dengan Utiliti Limpahan Dalam Tailwind



Dalam CSS Tailwind, “limpahan” utiliti mengawal cara elemen tertentu mengendalikan kandungan yang melebihi saiz bekas. Ia memerlukan pelbagai nilai, seperti 'auto', 'tatal', 'tersembunyi', 'kelihatan' dsb., dan melaksanakan fungsi tertentu dengan sewajarnya. Selain itu, pengguna juga boleh menggunakan titik putus dan pertanyaan media pada utiliti 'limpahan' untuk mengawal gelagat limpahan elemen tertentu pada saiz skrin yang berbeza.

Tulisan ini akan menggambarkan kaedah menggunakan titik putus dan pertanyaan media pada utiliti 'limpahan' dalam CSS Tailwind.

Bagaimana untuk Menggunakan Titik Putus dan Pertanyaan Media Dengan 'limpahan' dalam Tailwind?

Untuk menggunakan titik putus dan pertanyaan media tertentu pada utiliti 'limpahan' dalam Tailwind, buat struktur HTML. Kemudian, gunakan ' md ” atau “ lg ” titik putus dengan yang dikehendaki “limpahan- utiliti untuk mengawal kelakuan limpahan elemen yang ditentukan pada saiz skrin yang berbeza. Seterusnya, tukar saiz skrin halaman web untuk pengesahan.







Contoh
Dalam contoh ini, kita akan menggunakan “md” titik putus dengan 'Tatal limpahan' utiliti dalam



bekas untuk menambah bar skrol padanya dan sentiasa menunjukkannya pada saiz skrin sederhana: < badan >

< div kelas = 'overflow-auto md:overflow-scroll bg-purple-300 p-4 mx-16 mt-5 h-36 text-justify' >
CSS Tailwind menyediakan pelbagai utiliti 'limpahan', seperti
'overflow-auto', 'overflow-scroll', 'overflow-hidden', 'overflow-visible'
dll. Utiliti ini menentukan cara elemen tertentu mengendalikan kandungan
yang melebihi saiz bekas. Setiap utiliti menawarkan fungsi unik,
namun, matlamat akhir mereka tetap sama, iaitu untuk mengawal limpahan
tingkah laku elemen yang dipilih.

< / div >

< / badan >

di sini:



  • The “auto limpahan” kelas digunakan untuk menambah bar skrol ke bekas dan tunjukkan hanya apabila menatal diperlukan.
  • The “md:overflow-scroll” kelas menambah bar skrol dan sentiasa menunjukkannya pada “md” titik putus (saiz skrin sederhana).
  • Pengeluaran:





    Mengikut output di atas, titik putus dan pertanyaan media telah berjaya digunakan pada utiliti 'limpahan'.

    Kesimpulan

    Untuk menggunakan titik putus dan pertanyaan media mengenai utiliti 'limpahan' dalam Tailwind, gunakan ' sm ”, “ md ” atau “ lg ' titik putus dengan yang dikehendaki ' limpahan- ” utiliti dalam program HTML. Titik putus ini mengawal gelagat limpahan elemen yang ditentukan pada saiz skrin yang berbeza. Tulisan ini telah menggambarkan contoh untuk menggunakan titik putus tertentu dan pertanyaan media pada utiliti 'limpahan' dalam Tailwind.