Bagaimana untuk Mengubah Saiz Fon Secara Dinamik agar Sesuai dengan Div Satu Baris?

Melaraskan Saiz Fon untuk Muatkan Div pada Satu Baris

Soalan:

Bagaimana bolehkah saya mengubah saiz fon elemen teks secara dinamik untuk memastikan ia sesuai dalam teg div yang ditentukan, menghalangnya daripada membalut ke berbilang baris?

Jawapan:

Penyelesaian CSS:

CSS sahaja tidak boleh mencapai fungsi ini.

Penyelesaian JavaScript:

Kaedah 1: Menggunakan Javascript dan jQuery

1. Buat div tersembunyi dengan sifat CSS yang serupa dengan elemen teks asal (cth., font-family, position: absolute, visibility: hidden).
2. Salin teks daripada elemen asal ke div tersembunyi.
3. Tetapkan saiz fon awal untuk yang tersembunyi div.

4. Masukkan gelung yang:

   • Mendapat lebar div tersembunyi.
   • Membandingkannya dengan lebar yang diingini bagi div asal.
   • Laraskan saiz fon div tersembunyi dengan faktor atau unit yang ditetapkan sehingga lebar yang diingini adalah bertemu.
5. Tetapkan saiz fon yang dikira kepada elemen teks asal.

Kaedah 2: Pengoptimuman Gelung Sementara

Untuk meminimumkan bilangan lelaran gelung:

1. Tetapkan memulakan saiz fon.
2. Dapatkan lebar div tersembunyi.
3. Kira nisbah lebar antara div asal dan div tersembunyi.
4. Laraskan saiz fon tersembunyi div dengan faktor ini dan bukannya menambah atau mengurangkan satu unit.
5. Uji lebar yang tersembunyi div.

Atas ialah kandungan terperinci Bagaimana untuk Mengubah Saiz Fon Secara Dinamik agar Sesuai dengan Div Satu Baris?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!