Câmpuri de introducere a textului dezactivate Bootstrap

Campuri De Introducere A Textului Dezactivate Bootstrap



În Bootstrap, diferite clase sunt utilizate pentru a crea un formular eficient. Aceste clase oferă elementelor numeroase proprietăți de stil, care includ „ controlul formei ”, “ forma-grup ”, “ formular-verificare-etichetă ', si multe altele. Mai precis, câmpurile de introducere a formularelor sunt câmpuri de introducere a textului utilizate pentru a colecta informații de la utilizatori. Cu toate acestea, putem dezactiva câmpul de intrare utilizând „ dezactivat ” clasă sau atribut.

Acest articol va acoperi următoarele subiecte:

Condiție preliminară: Creați un formular

Mai întâi, creați un formular utilizând codul HTML „

' element:







< formă >< / formă >

Apoi, adăugați un „ ” element și atribuiți-i o clasă ” col-12 ”. În cadrul elementului specificați legenda formularului:



< set de câmpuri clasă = 'col-md-12' >

< legendă >Formular de înscriere pentru studenți< / legendă >

< / set de câmpuri >

Ieșire







Cum se dezactivează câmpul de introducere a textului?

Pentru exemplul în curs, urmați instrucțiunile date:

  • În interiorul ' „, după elementul legendă, adăugați o etichetă
    și atribuiți-i o clasă „ forma-grup ”.
  • Apoi, includeți „ ' și ' ” elemente pentru legendă și, respectiv, câmpurile de intrare. Atribuiți elementului de intrare o clasă „ controlul formei ”.
  • După aceea, alocați „ dezactivat ” pentru a dezactiva câmpul de introducere:
< div clasă = 'grup-form' >

< eticheta > Introduceți dvs Nume

< intrare tip = 'text' clasă = 'controlul formei' dezactivat>

< / eticheta >

< / div >

Mai jos este explicația claselor menționate mai sus:



  • forma-grup ” este o clasă flexibilă care oferă cea mai simplă modalitate de a include structura în formulare.
  • controlul formei ” adaugă automat un stil elementelor de formular.

Ieșire

Adăugați un alt câmp de introducere fără „ dezactivat ” atribut:

< div clasă = 'grup-form' >

< eticheta > Intră în Tatăl tău Nume

< intrare tip = 'text' clasă = 'controlul formei' >

< / eticheta >

< / div >

Se poate observa că primul câmp de intrare este dezactivat, iar al doilea este activat:

Cum se dezactivează opțiunea de selectare a casetei?

Pentru a crea o casetă de selectare în formular, utilizați codul HTML „ ' element. „ ” sunt apoi adăugate elemente pentru a selecta elementele casetei.

În acest exemplu, observați că a doua opțiune este setată ca fiind dezactivată folosind butonul „ dezactivat ” atribut:

< div clasă = 'grup-form' >

< eticheta > Dezactivat Selectați Caseta

< Selectați clasă = 'controlul formei' >

< opțiune >selectați < / opțiune >

< opțiune dezactivat> Dezactivat selectează< / opțiune >

< opțiune >Meniu< / opțiune >

< / Selectați >

< / eticheta >

< / div >

Ieșire

Cum se dezactivează elementul de introducere a casetei de selectare?

Să facem o altă casetă de selectare pentru controlul formularelor. Pentru a dezactiva caseta de selectare, „ dezactivat ” atributul este specificat după cum urmează:

< div clasă = 'verificare formular' >

< eticheta clasă = „formular-verificare-etichetă” >

< intrare clasă = 'formular-verificare-intrare' tip = 'Caseta de bifat' dezactivat>

Poti nu verifica asta



Ieșire

Cum se dezactivează elementul de introducere a butonului?

De asemenea, puteți adăuga un element de buton HTML pentru trimiterea formularului. Acum, să dezactivăm acest buton utilizând butonul „ dezactivat ” clasa:

< buton tip = 'Trimite' clasă = „btn btn-primary btn-lg dezactivat” >Trimite< / buton >

Ieșire

Acesta a fost totul despre dezactivarea câmpurilor de intrare în Bootstrap.

Concluzie

În Bootstrap, controalele formularului pot fi dezactivate utilizând „ dezactivat ” atribut sau clasă. Atributul este plasat în interiorul etichetei de pornire a elementului. Pe de altă parte, „ dezactivat ” clasa este plasată în cadrul ” clasă ” atribut. Acest articol a oferit exemple pentru a ilustra cum să dezactivați controalele formularului în Bootstrap.