Rumah  >  Artikel  >  hujung hadapan web  >  Bagaimana untuk Menghapuskan Sempadan Garis Daripada Butang Input dalam Penyemak Imbas?

Bagaimana untuk Menghapuskan Sempadan Garis Daripada Butang Input dalam Penyemak Imbas?

DDD
DDDasal
2024-11-23 19:01:12911semak imbas

How to Eliminate Outline Borders From Input Buttons in Browsers?

Menggayakan Butang Input untuk Menghapuskan Sempadan Garis Besar

Pelayar tertentu memberikan sempadan garis besar di sekeliling butang input, yang boleh menjejaskan estetika butang dan pengalaman pengguna . Isu ini timbul apabila butang hilang fokus, meninggalkan sempadan yang tidak sedap dipandang. Untuk mengalih keluar sempadan ini, sifat "garis besar" boleh digunakan.

Dalam coretan kod yang disediakan, CSS untuk butang input ditakrifkan tanpa sifat garis besar. Untuk mengalih keluar jidar, tambahkan baris berikut:

outline: none;

Berikut ialah kod CSS yang dikemas kini:

input[type=button] {
  width: 120px;
  height: 60px;
  margin-left: 35px;
  display: block;
  background-color: gray;
  color: white;
  border: none;
  outline: none;
}

Penggayaan yang diubah suai ini akan menghapuskan sempadan garis besar daripada butang input dalam Chrome dan lain-lain penyemak imbas yang menyokong sifat "outline".

Dengan menyatakan "outline: none;", penyemak imbas diarahkan untuk mengalih keluar sebarang sempadan atau bercahaya di sekeliling butang, tanpa mengira keadaan fokusnya. Ini memastikan penampilan yang bersih dan seragam untuk butang sepanjang interaksi pengguna.

Atas ialah kandungan terperinci Bagaimana untuk Menghapuskan Sempadan Garis Daripada Butang Input dalam Penyemak Imbas?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn