Pengalaman pengguna diutamakan, saiz fon meninggalkan px dan memilih pertukaran em_Experience

Dalam era Internet hari ini yang menyokong reka bentuk kebolehgunaan dan reka bentuk pengalaman pengguna, CSS juga mesti mengambil bahagian di dalamnya. Kebanyakan orang sentiasa menentukan saiz fon keseluruhan terlebih dahulu apabila menulis kod CSS Dalam kes Cina, ia biasanya 12px Namun, sebenarnya, tetapan "Saiz Paparan Teks" dalam menu atas IE. Ia sudah pasti pengalaman pengguna yang sangat buruk untuk penonton yang merasakan saiz fon terlalu kecil. Malah, semua ini boleh dielakkan, iaitu menggunakan unit em sebagai unit paparan fon.

Ketinggian fon lalai penyemak imbas ialah 16px, jadi penyemak imbas yang tidak dilaraskan memaparkan 1em=16px. Jika ditukar, ini bermakna 1px=0.0625em, iaitu, 12px=0.75em, 10px=0.625em, melalui 1px=0.0625em, anda boleh menukar px kepada em semasa menulis CSS. Tetapi ada cara yang lebih mudah, teruskan membaca!

Kaedah ini memerlukan penggunaan % unit (hanya sekali sahaja, % dan em boleh difahami dengan mudah kerana yang pertama hanya mempunyai dua sifar lebih daripada yang kedua). Untuk memudahkan penukaran saiz fon, anda boleh mengisytiharkan saiz fon=62.5% secara global dalam kandungan dalam CSS Algoritma % di sini adalah sama dengan em, 100%=16px, 1px=6.25%, 10px=62.5. %, Iaitu, saiz fon lalai ditakrifkan sebagai 10px. Ramai pemula boleh mentakrifkan 0.625em di sini atau mentakrifkan secara langsung 12px Ini tidak mempunyai kesan. Memandangkan em mempunyai ciri mewarisi saiz fon bagi elemen bleed induk, iaitu 1em=10px, jadi 12px=1.2em. Penukaran antara px dan em boleh diperolehi melalui 10, yang sangat mudah!

Selain itu, satu perkara yang mesti diambil perhatian Mungkin apabila IE memproses aksara Cina, ketepatan nilai titik terapung adalah terhad 62.5% daripada fon 12px di bawah badan adalah sedikit lebih besar daripada yang ditakrifkan secara langsung selagi Just berubah 62.5% kepada 63%. Melalui pelarasan di atas pada kod CSS, anda akan mendapati bahawa tapak web anda selangkah lebih dekat dengan reka bentuk pengalaman pengguna Ini sangat penting dalam era Internet hari ini yang menyokong reka bentuk kebolehgunaan dan reka bentuk pengalaman pengguna.

<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>Laman Utama Skrip <a href="</title">www.jb51.net</a> </title>> <style type="text/css"> body{ font-size:63%; } </style> <p style="font-size:1.2em;">saiz fon:1.2em Alimanman (boleh laras)</p> <p style="font-size:12px;">saiz fon:12px Alimanman (tidak boleh dilaraskan)</p> <p style="font-size:1.2em; color:#F90;">Anda boleh melaraskan saiz paparan fon melalui "Paparan - Saiz Teks" dalam menu atas IE </p>
[Ctrl+A untuk memilih semua Nota: Jika anda perlu memperkenalkan Js luaran, anda perlu memuat semulanya untuk melaksanakan ]