Rumah >hujung hadapan web >html tutorial >Penjelasan terperinci tentang teg HTML dan kaedah melumpuhkannya_HTML/Xhtml_Pengeluaran halaman web

Penjelasan terperinci tentang teg HTML dan kaedah melumpuhkannya_HTML/Xhtml_Pengeluaran halaman web

WBOY
WBOYasal
2016-05-16 16:36:301519semak imbas

Definisi dan penggunaan
digunakan untuk mengumpul maklumat pengguna.
Menurut nilai atribut jenis yang berbeza, medan input mempunyai banyak bentuk. Medan input boleh menjadi medan teks, kotak semak, kawalan teks bertopeng, butang radio, butang, dsb.
Perbezaan antara HTML dan XHTML
Dalam HTML, teg tidak mempunyai teg penutup.
Dalam XHTML, teg
Contoh
Borang HTML ringkas yang mengandungi dua kotak input teks dan butang hantar:

Kod XML/HTMLSalin kandungan ke papan keratan
  1. <borang tindakan="form_action.asp" kaedah="dapatkan">
  2. Nama pertama: <input taip= "teks" nama="fname" />
  3. Nama keluarga: <input taip= "teks" nama="lname" />
  4. <masukan taip="serahkan" nilai="Serah" />
  5. borang>

Atribut dilumpuhkan menentukan bahawa elemen input harus dilumpuhkan.
Elemen input yang dilumpuhkan tidak tersedia dan tidak boleh diklik. Atribut yang dilumpuhkan boleh ditetapkan sehingga beberapa syarat lain dipenuhi (seperti kotak pilihan dipilih, dsb.). Kemudian, anda perlu menggunakan JavaScript untuk mengalih keluar nilai yang dilumpuhkan dan menukar nilai elemen input kepada tersedia.
201585180424922.jpg (205×270)

Tiga kaedah penulisan berikut boleh melumpuhkan input

Kod XML/HTMLSalin kandungan ke papan keratan
  1. <input taip="teks" orang kurang upaya="kurang upaya" nilai=<🎜 🎜>"Dilumpuhkan" />
  2. <input taip="teks" kurang upaya="kurang upaya" nilai="Dilumpuhkan" />
  3. <input taip="teks" kurang upaya="kurang upaya" nilai="Dilumpuhkan" />
Input yang dilumpuhkan berwarna kelabu secara lalai dan boleh digayakan melalui CSS. Nota: IE9 dan ke bawah tidak boleh menukar warna fon

1. Gunakan CSS3 :disabled pseudo-element definition


Kod CSSSalin kandungan ke papan keratan
  1. //Chrome Firefox Opera Safari
  2. input:dilumpuhkan{
  3.  sempadan: 1px pepejal #DDD;
  4. warna latar belakang: #F5F5F5
  5.  warna:#ACA899
  6. }
2. Gunakan pemilih atribut untuk mentakrifkan



Kod CSSSalin kandungan ke papan keratan
  1. //IE6 gagal
  2. input[dilumpuhkan]{
  3.  sempadan: 1px pepejal #DDD;
  4. warna latar belakang: #F5F5F5
  5.  warna:#ACA899
  6. }
3 Gunakan kelas untuk mentakrif dan menambah kelas untuk input dilumpuhkan



Kod CSSSalin kandungan ke papan keratan
  1. input.dilumpuhkan{
  2.  sempadan: 1px pepejal #DDD;
  3. warna latar belakang: #F5F5F5
  4.  warna:#ACA899
  5. }

Keputusan akhir:

Kod CSSSalin kandungan ke papan keratan
  1. //Chrome Firefox Opera Safari IE9
  2. input:dilumpuhkan{
  3.  sempadan: 1px pepejal #DDD;
  4. warna latar belakang: #F5F5F5
  5.  warna:#ACA899
  6. }
  7. //IE8-
  8. input[dilumpuhkan]{
  9.  sempadan: 1px pepejal #DDD;
  10. warna latar belakang: #F5F5F5
  11.  warna:#ACA899
  12. }
  13. //IE6 Menggunakan Javascript untuk menambah kelas CSS "dilumpuhkan"
  14. * input html.dilumpuhkan{
  15.  sempadan: 1px pepejal #DDD;
  16. warna latar belakang: #F5F5F5
  17.  warna:#ACA899
  18. }

Nota: pepijat IE8
Oleh kerana IE8 tidak mengenali :disabled, input[disabled] dan input:disabled styles menjadi tidak sah Anda boleh mempertimbangkan untuk menulisnya secara berasingan atau menggunakan input[disabled] secara langsung. ;Warna fon tidak boleh ditukar dalam IE9 dan ke bawah.

Demo

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