Penjelasan terperinci tentang teg <input> HTML dan kaedah melumpuhkannya_HTML/Xhtml_Pengeluaran halaman web-html tutorial-php.cn

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

WBOY

Lepaskan： 2016-05-16 16:36:30

asal

1476 orang telah melayarinya

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

<borang tindakan="form_action.asp" kaedah="dapatkan">
Nama pertama: <input taip= "teks" nama="fname" />
Nama keluarga: <input taip= "teks" nama="lname" />
<masukan taip="serahkan" nilai="Serah" />
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

<input taip="teks" orang kurang upaya="kurang upaya" nilai=<🎜 🎜>"Dilumpuhkan" />
<input taip="teks" kurang upaya="kurang upaya" nilai="Dilumpuhkan" />
<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

//Chrome Firefox Opera Safari
input:dilumpuhkan{
sempadan: 1px pepejal #DDD;
warna latar belakang: #F5F5F5
warna:#ACA899;
}

2. Gunakan pemilih atribut untuk mentakrifkan

Kod CSSSalin kandungan ke papan keratan

//IE6 gagal
input[dilumpuhkan]{
sempadan: 1px pepejal #DDD;
warna latar belakang: #F5F5F5
warna:#ACA899;
}

3 Gunakan kelas untuk mentakrif dan menambah kelas untuk input dilumpuhkan

Kod CSSSalin kandungan ke papan keratan

input.dilumpuhkan{
sempadan: 1px pepejal #DDD;
warna latar belakang: #F5F5F5
warna:#ACA899;
}

Keputusan akhir:

Kod CSSSalin kandungan ke papan keratan

//Chrome Firefox Opera Safari IE9
input:dilumpuhkan{
sempadan: 1px pepejal #DDD;
warna latar belakang: #F5F5F5
warna:#ACA899;
}
//IE8-
input[dilumpuhkan]{
sempadan: 1px pepejal #DDD;
warna latar belakang: #F5F5F5
warna:#ACA899;
}
//IE6 Menggunakan Javascript untuk menambah kelas CSS "dilumpuhkan"
* input html.dilumpuhkan{
sempadan: 1px pepejal #DDD;
warna latar belakang: #F5F5F5
warna:#ACA899;
}

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