Bagaimana untuk Mencegah Perubahan Saiz Font Hiperpautan iPhone pada Orientasi?

Cara Mengekalkan Saiz Font Hiperpautan Semasa Perubahan Orientasi iPhone

Apabila membangunkan aplikasi web mudah alih, mengekalkan pengalaman pengguna yang konsisten merentas orientasi peranti yang berbeza adalah penting. Ini termasuk mengekalkan penggayaan elemen teks, seperti saiz fon.

Satu isu timbul apabila memberikan hiperpautan pada iPhone. Secara lalai, apabila bertukar daripada mod potret ke landskap, saiz fon hiperpautan meningkat dengan ketara. Ini boleh mengganggu estetika visual dan kebolehbacaan.

Penyelesaian: Lumpuhkan Skala Saiz Teks dengan -webkit-text-size-adjust

Untuk menangani isu ini, anda boleh menggunakan sifat CSS -webkit-text-size-adjust. Sifat ini membolehkan anda melumpuhkan penskalaan saiz fon semasa perubahan orientasi sambil masih membenarkan pengguna mengezum masuk atau keluar.

Berikut ialah cara untuk melaksanakan penyelesaian ini:

html {
    -webkit-text-size-adjust: 100%; /* Prevent font scaling in landscape while allowing user zoom */
}

Dengan menetapkan -webkit- text-size-adjust property kepada 100%, anda meneutralkan gelagat lalai peranti untuk membesarkan teks dalam mod landskap dengan berkesan. Akibatnya, hiperpautan akan mengekalkan saiz fonnya tanpa mengira orientasi peranti.

Contoh:

Dalam contoh anda diberikan:

ul li a {
    font-size:14px;
    text-decoration: none;
    color: #cc9999;
}

Menambah sifat -webkit-text-size-adjust pada elemen HTML akan memastikan hiperpautan mengekalkan saiz fon 14px mereka dalam kedua-dua potret dan orientasi landskap.

Atas ialah kandungan terperinci Bagaimana untuk Mencegah Perubahan Saiz Font Hiperpautan iPhone pada Orientasi?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!