Bagaimana untuk Memaparkan Anak Panah Atas/Bawah dalam Medan Input Nombor Tanpa mengira Kedudukan Kursor?

Memaparkan Anak panah Atas/Bawah Sentiasa Kelihatan untuk Medan Nombor Input

S: Adakah mungkin untuk memaparkan butang anak panah secara konsisten untuk pelarasan dalam " nombor" medan input, tanpa mengira kedudukan kursor?

J: Ya, anda boleh mencapai ini menggunakan CSS dalam Chrome.

HTML:

<input type="number">

CSS:

<code class="css">input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  -webkit-appearance: "always show up/down arrows";
}</code>

Walau bagaimanapun, adalah penting untuk ambil perhatian bahawa kaedah ini mungkin tidak berfungsi dalam penyemak imbas lain. Sebagai alternatif, anda boleh menggunakan sifat kelegapan:

<code class="css">input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
  opacity: 1;
}</code>

Pendekatan ini harus berfungsi dalam Chrome, tetapi adalah penting untuk mempertimbangkan mekanisme sandaran untuk memastikan keserasian dengan pelbagai penyemak imbas.

Atas ialah kandungan terperinci Bagaimana untuk Memaparkan Anak Panah Atas/Bawah dalam Medan Input Nombor Tanpa mengira Kedudukan Kursor?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!