Sourceފޯމުތައް
ފޯމް ކޮންޓްރޯލް ސްޓައިލްތަކާއި، ލޭއައުޓް އޮޕްޝަންތަކާއި، ތަފާތު ގިނަ ފޯމްތައް އުފެއްދުމަށް ބޭނުންކުރާ ކަސްޓަމް ކޮމްޕޯނެންޓްތަކުގެ މިސާލުތަކާއި ބޭނުންކުރުމުގެ ގައިޑްލައިންތައް.
ބޫޓްސްޓްރެޕްގެ ފޯމް ކޮންޓްރޯލްތައް އަޅުގަނޑުމެންގެ ރީބޫޓް ކޮށްފައިވާ ފޯމް ސްޓައިލްތަކުގައި ކްލާސްތަކާއެކު ފުޅާކޮށްދެއެވެ. މި ކްލާސްތައް ބޭނުންކޮށްގެން އެމީހުންގެ ކަސްޓަމައިޒް ކޮށްފައިވާ ޑިސްޕްލޭތަކަށް ވަދެ ބްރައުޒާތަކާއި ޑިވައިސްތަކުގެ ތެރެއިން އެއްގޮތަކަށް ރެންޑަރިންގ އެއް ލިބޭނެއެވެ.
އީމެއިލް ވެރިފިކޭޝަން، ނަންބަރު ހޮވުން، އަދި އެހެނިހެން އާ އިންޕުޓް ކޮންޓްރޯލްތަކުގެ ފައިދާ ނެގުމަށްޓަކައި type
ހުރިހާ އިންޕުޓްތަކެއްގައި (އެބަހީ، email
އީމެއިލް އެޑްރެހަށް ނުވަތަ އަދަބީ މައުލޫމާތަށް) އެކަށީގެންވާ އެޓްރިބިއުޓެއް ބޭނުންކުރުން ޔަގީންކުރައްވާށެވެ.number
މިއީ ބޫޓްސްޓްރެޕްގެ ފޯމް ސްޓައިލްތައް ދައްކާލުމަށް އަވަސް މިސާލެކެވެ. ބޭނުންވާ ކްލާސްތަކާއި، ފޯމް ލޭއައުޓް އަދި އެހެނިހެން ކަންކަމުގެ ލިޔެކިޔުންތައް ހޯދުމަށް ކިޔަމުން ގެންދާށެވެ.
ޓެކްސްޗުއަލް ފޯމް ކޮންޓްރޯލްތައް- <input>
s، <select>
s، އަދި <textarea>
s ފަދަ- ކްލާހާއެކު ސްޓައިލް ކުރެވެއެވެ .form-control
. އޭގެ ތެރޭގައި އާންމު ސިފައާއި، ފޯކަސް ސްޓޭޓާއި، ސައިޒިންގއާއި، އަދިވެސް އެތައް ސްޓައިލްތަކެއް ހިމެނެއެވެ.
އަޅުގަނޑުމެންގެ ކަސްޓަމް ފޯމްތައް އިތުރަށް ސްޓައިލް ކުރުމަށް ޔަޤީންކޮށް އެކްސްޕްލޯރ ކުރައްވާށެވެ <select>
.
.form-control
ފައިލް އިންޕުޓްތަކަށް، ފޯ ސްވޮޕް ކުރާށެވެ .form-control-file
.
.form-control-lg
އަދި ފަދަ ކްލާސްތައް ބޭނުންކޮށްގެން އުސްމިންތައް ކަނޑައެޅުން .form-control-sm
.
readonly
އިންޕުޓްގެ އަގަށް ބަދަލު އައުން ހުއްޓުވުމަށްޓަކައި އިންޕުޓެއްގެ މައްޗަށް ބޫލިއަން އެޓްރިބިއުޓް އިތުރުކުރުން . ހަމައެކަނި ރީޑް-އޮންލީ އިންޕުޓްތައް ލުއިކޮށް ފެންނަ (ހަމަ ޑިސެބިލް ކުރެވިފައިވާ އިންޕުޓްތަކެކޭ އެއްފަދައިން) ނަމަވެސް ސްޓޭންޑަރޑް ކަރސަރ ހިފަހައްޓާށެވެ.
ކިޔުމަށް އެކަނި ސާދާ ލިޔުމެއް
<input readonly>
ތިބާގެ ފޯމުގައި ހުންނަ އެލިމެންޓްތައް އާދައިގެ ލިޔުމެއްގެ ގޮތުގައި ސްޓައިލްކޮށްފައި ހުންނަން ބޭނުންނަމަ ، .form-control-plaintext
ޑިފޯލްޓް ފޯމް ފީލްޑް ސްޓައިލިންގ ނައްތާލައި، ރަނގަޅު މާރޖިން އާއި ޕެޑިންގ ރައްކާތެރި ކުރުމަށް ކްލާސް ބޭނުން ކުރާށެވެ.
ބޭނުންކޮށްގެން ހޮރައިޒޮންޓަލީ ސްކްރޯލް ކުރެވޭ ރޭންޖް އިންޕުޓްސް ސެޓް ކުރުން .form-control-range
.
ޗެކްބޮކްސްތަކާއި ރޭޑިއޯތަކެވެ
.form-check
ޑިފޯލްޓް ޗެކްބޮކްސްތަކާއި ރޭޑިއޯތައް ރަނގަޅުކޮށްފައިވަނީ , ދެ އިންޕުޓް ވައްތަރަށް ވެސް އެއް ކްލާހެއްގެ އެހީގައި އެމީހުންގެ އެޗްޓީއެމްއެލް އެލިމެންޓްތަކުގެ ލޭއައުޓާއި ސުލޫކު ރަނގަޅުކޮށްދޭ ކްލާހެކެވެ . ޗެކްބޮކްސް އަކީ ލިސްޓެއްގައި އެއް ނުވަތަ އެތައް ގޮތެއް ހޮވުމަށް ބޭނުންކުރާ އެއްޗެއް ކަމަށާއި، ރޭޑިއޯތަކަކީ ގިނަ ގޮތްތަކުގެ ތެރެއިން އެއް ގޮތް ހޮވުމަށް ބޭނުންކުރާ އެއްޗެކެވެ.
ޑިސެބިލްޑް ޗެކްބޮކްސްތަކާއި ރޭޑިއޯތަކަށް ސަޕޯޓް ކުރެވޭ ނަމަވެސް not-allowed
، ބެލެނިވެރިޔާގެ ހޯވަރގައި ކަރސަރެއް ފޯރުކޮށްދިނުމަށްޓަކައި <label>
، ތިބާއަށް disabled
އެޓްރިބިއުޓް އިތުރުކުރަން ޖެހޭނެއެވެ .form-check-input
. ޑިސެބިލް ކޮށްފައިވާ އެޓްރިބިއުޓް އިން އިންޕުޓްގެ ހާލަތު ދައްކާލުމަށް އެހީތެރިވުމަށްޓަކައި ފަނޑު ކުލައެއް ޖަހާނެއެވެ.
ޗެކްބޮކްސްތަކާއި ރޭޑިއޯތައް ބޭނުންކުރާ ތަކެތި ބިނާކޮށްފައިވަނީ އެޗްޓީއެމްއެލް އަށް ބިނާކޮށް ފޯމް ވެލިޑޭޝަން އަށް ސަޕޯޓްކޮށް، ޚުލާޞާކޮށް، އެކްސެސިބަލް ލޭބަލްތައް ފޯރުކޮށްދިނުމަށެވެ. އެގޮތުން، އަޅުގަނޑުމެންގެ <input>
s އަދި <label>
s އަކީ އެއްބަނޑު އެއްބަފާ އުނިއިތުރުތަކެއް ކަމުގައި ވާއިރު، އޭގެ <input>
ތެރޭގައިވާ އެއް އުނިއިތުރެވެ <label>
. މިއީ ތަންކޮޅެއް ބޮޑަށް ވާރބޯސް އެއް ކަމުގައި ވާތީ ތިބާ ކަނޑައަޅަންޖެހޭ id
އަދި for
އެޓްރިބިއުޓްސް އާއި ގުޅުވައިލުމަށްޓަކައި <input>
އަދި <label>
.
ޑިފޯލްޓް (ސްޓޭކްކޮށްފައި)
ބައި ޑިފޯލްޓްކޮށް، ވަގުތީ އެއްބަނޑު އެއްބަފާ އެއްބަޔަކު އަނެއްބަޔަކަށްވާ ކޮންމެ އަދަދެއްގެ ޗެކްބޮކްސްތަކާއި ރޭޑިއޯތައް ވަރުގަދައަށް ސްޓޭކްކޮށް، އެކަށީގެންވާ ގޮތެއްގައި ޖާގަ ކުރެވިފައިވާނެއެވެ .form-check
.
އެއް ހޮރައިޒޮންޓަލް ރޯއެއްގައި ހުންނަ ޗެކްބޮކްސް ނުވަތަ ރޭޑިއޯތައް ގްރޫޕްކޮށް .form-check-inline
ކޮންމެ .form-check
.
އެއްވެސް ލޭބަލް ޓެކްސްޓެއް ނެތް .position-static
އެތެރޭގައި ހުންނަ އިންޕުޓްތަކަށް އެޑް ކުރާށެވެ . .form-check
އަދިވެސް އެހީތެރި ޓެކްނޮލޮޖީތަކަށް ކޮންމެވެސް ވައްތަރެއްގެ ލޭބަލް ފޯރުކޮށްދިނުން ހަނދާން ކުރާށެވެ (މިސާލަކަށް، ބޭނުންކުރުން aria-label
).
ބޫޓްސްޓްރެޕް އެޕްލައި ކުރެވޭތީ display: block
އަދި width: 100%
އަޅުގަނޑުމެންގެ ގާތްގަނޑަކަށް ހުރިހާ ފޯމް ކޮންޓްރޯލްތަކަށް ވެސް ފޯމްތައް ޑިފޯލްޓްކޮށް ވަރުގަދައަށް ސްޓޭކް ވާނެއެވެ. މި ލޭއައުޓް ތަފާތު ކުރުމަށް އިތުރު ކްލާސްތައް ބޭނުން ކުރެވިދާނެ ޕަރ ފޯމް އުސޫލުންނެވެ.
.form-group
ފޯމްތަކަށް ކޮންމެވެސް ވަރެއްގެ އޮނިގަނޑެއް އިތުރުކުރުމަށް އެންމެ ފަސޭހަ ގޮތަކީ ކްލާހެވެ . އެއީ ލޭބަލްތަކާއި، ކޮންޓްރޯލްތަކާއި، އިޚްތިޔާރީ ހެލްޕް ޓެކްސްޓާއި، ފޯމް ވެލިޑޭޝަން މެސެޖިންގ ރަނގަޅަށް ގްރޫޕްކުރުމަށް ހިތްވަރުދޭ ފްލެކްސިބަލް ކްލާހެކެވެ. ބައި ޑިފޯލްޓް it only applies margin-bottom
, އެކަމަކު ބޭނުންވާ ގޮތަށް އިތުރު ސްޓައިލްތައް ނަގައެވެ .form-inline
. <fieldset>
s، <div>
s، ނުވަތަ ގާތްގަނޑަކަށް އެހެން އެއްވެސް އުނިއިތުރަކާއެކު ބޭނުން ކުރާށެވެ .
އަޅުގަނޑުމެންގެ ގްރިޑް ކްލާސްތައް ބޭނުންކޮށްގެން މިއަށްވުރެ ކޮމްޕްލެކްސް ފޯމްތައް ބިނާކުރެވިދާނެއެވެ. މިއީ ގިނަ ކޮލަމްތަކާއި، ތަފާތު ފުޅާމިންތަކާއި، އިތުރު އެލައިންމަންޓް އޮޕްޝަންތައް ބޭނުންވާ ފޯމް ލޭއައުޓްތަކަށް ބޭނުންކުރާށެވެ.
އަދި ސްވޮޕް ކުރެވިދާނެ .row
, .form-row
އަޅުގަނޑުމެންގެ ސްޓޭންޑަރޑް ގްރިޑް ރޯގެ ވައްތަރެއް ކަމުގައިވާ ޑިފޯލްޓް ކޮލަމް ގަޓަރުތައް އޯވަރރައިޑްކޮށް ތަތް އަދި ކޮމްޕެކްޓް ލޭއައުޓްތަކަށް.
އަދި މިއަށްވުރެ ކޮމްޕްލެކްސް ލޭއައުޓްތައް ވެސް ގްރިޑް ސިސްޓަމުން އުފެއްދިދާނެ އެވެ.
.row
ފޯމް ގްރޫޕްތަކަށް ކްލާސް އިތުރުކޮށް، .col-*-*
ކްލާސްތައް ބޭނުންކޮށްގެން ތިމާގެ ލޭބަލްތަކާއި ކޮންޓްރޯލްތަކުގެ ފުޅާމިން ކަނޑައަޅައިގެން ގްރިޑާއެކު ހޮރައިޒޮންޓަލް ފޯމްތައް އުފައްދާށެވެ . ޔަޤީންކޮށްލައްވާ .col-form-label
ތިޔަބޭފުޅުންގެ <label>
s އަށް ވެސް އިތުރު ކުރައްވާ ކަމުން އެމީހުން ވަރޓިކަލީ ސެންޓަރ ކޮށްފައި ހުންނަނީ އެމީހުންނާ ގުޅުންހުރި ފޯމް ކޮންޓްރޯލްތަކާ އެކުގައެވެ.
ބައެއް ފަހަރު، ތިބާއަށް ބޭނުންވާ އެ ފުރިހަމަ އެލައިންމަންޓް އުފެއްދުމަށްޓަކައި މާރޖިން ނުވަތަ ޕެޑިންގ ޔުޓިލިޓީސް ބޭނުން ކުރަން ޖެހިދާނެއެވެ. މިސާލަކަށް، padding-top
ޓެކްސްޓް ބޭސްލައިން ރަނގަޅަށް އެލައިން ކުރުމަށްޓަކައި އަޅުގަނޑުމެންގެ ސްޓޭކް ކުރެވިފައިވާ ރޭޑިއޯ އިންޕުޓްސް ލޭބަލް އަޅުގަނޑުމެން ނައްތާލާފައި މިވަނީ.
އަދި ގެ ސައިޒަށް ރަނގަޅަށް ތަބާވުމަށް ނުވަތަ ތިމާގެ s ނުވަތަ s .col-form-label-sm
އަށް .col-form-label-lg
ބޭނުންކުރުން <label>
ޔަގީން ކުރައްވާށެވެ .<legend>
.form-control-lg
.form-control-sm
ކުރީގެ މިސާލުތަކުން ދައްކާފައިވާ ފަދައިން އަޅުގަނޑުމެންގެ ގްރިޑް ސިސްޓަމްގެ ސަބަބުން ކޮންމެ އަދަދެއްގެ s އެއް ނުވަތަ .col
ގެ ތެރޭގައި ބެހެއްޓޭނެއެވެ . އެމީހުން ލިބޭ ފުޅާމިން އެމީހުންގެ މެދުގައި ހަމަހަމަ ގޮތެއްގައި ބަހާލާނެއެވެ. އަދި މަދު ނުވަތަ މަދު ޖާގައެއް ނަގަން ތިބާގެ ކޮލަމްތަކުގެ ސަބްސެޓެއް ހޮވިދާނެ، ބާކީ ހުރި s އިން ބާކީ ހުރި ބައިތައް ހަމަހަމަ ގޮތެއްގައި ބަހާލާ، ވަކި ކޮލަމް ކްލާސްތަކާއެކު ..row
.form-row
.col
.col-7
ތިރީގައިވާ މިސާލުގައި ފްލެކްސްބޮކްސް ޔުޓިލިޓީއެއް ބޭނުންކޮށްގެން ކޮންޓެންޓްތައް ވަރުގަދައަށް ސެންޓަރކޮށް ބަދަލުތައް ގެނެސްދެނީ .col
ތިބާގެ .col-auto
ކޮލަމްތަކުން ބޭނުންވާ ވަރަށް ޖާގަ ނަގާނެ ގޮތަކަށެވެ. އެހެން ގޮތަކަށް ބުނާނަމަ، ކޮލަމް ސައިޒް ކުރަނީ ކޮންޓެންޓްތަކަށް ބަލައިގެންނެވެ.
އެއަށްފަހު އެކަން އަނެއްކާވެސް ސައިޒަށް ޚާއްޞަ ކޮލަމް ކްލާސްތަކާއެކު ރީމިކްސް ކުރެވިދާނެއެވެ.
އަދި ހަމަގައިމުވެސް ކަސްޓަމް ފޯމް ކޮންޓްރޯލްތަކަށް ސަޕޯޓް ކުރެވެއެވެ.
.form-inline
އެއް ހޮރައިޒޮންޓަލް ރޯއެއްގައި ލޭބަލްތަކާއި، ފޯމް ކޮންޓްރޯލްތަކާއި، ބަޓަންތަކުގެ ސިލްސިލާއެއް ދައްކާލުމަށް ކްލާސް ބޭނުންކުރާށެވެ . އިންލައިން ފޯމްތަކުގެ ތެރޭގައި ހުންނަ ފޯމް ކޮންޓްރޯލްތައް އެ ފޯމްތަކުގެ ޑިފޯލްޓް ސްޓޭޓްތަކާ ކުޑަކޮށް ތަފާތުވެއެވެ.
- ކޮންޓްރޯލްސް އަކީ
display: flex
, އެއްވެސް އެޗްޓީއެމްއެލް ވައިޓް ސްޕޭސް ކޮލަޕްސްކޮށް ސްޕޭސިންގ އަދި ފްލެކްސްބޮކްސް ޔުޓިލިޓީސް އާއި އެކު އެލައިންމަންޓް ކޮންޓްރޯލް ފޯރުކޮށްދިނުމުގެ ފުރުސަތު ލިބިގެންދާ އެއްޗެކެވެ.
- ކޮންޓްރޯލްތަކާއި އިންޕުޓް ގްރޫޕްތަކަށް ލިބެނީ
width: auto
ބޫޓްސްޓްރަޕް ޑިފޯލްޓް އޯވަރރައިޑް ކުރުމަށް width: 100%
.
- ކޮންޓްރޯލްތައް އިންލައިން އިން ފެންނަނީ ހަމައެކަނި މޯބައިލް ޑިވައިސްތަކުގައި ހުންނަ ހަނި ވިއުޕޯޓްތަކަށް އެކައުންޓް ކުރުމަށް މަދުވެގެން 576px ފުޅާމިނުގައި ހުންނަ ވިއުޕޯޓްތަކުގަ އެވެ.
ވަކިވަކި ފޯމް ކޮންޓްރޯލްތަކުގެ ފުޅާމިނާއި ސްޕޭސިންގ ޔުޓިލިޓީސް އާއި އެލައިންމަންޓް މެނުއަލްކޮށް އެޑްރެސް ކުރަން ޖެހިދާނެއެވެ (ތިރީގައި ދައްކާފައިވާ ގޮތަށް). <label>
އެންމެ ފަހުން، ސްކްރީންރީޑަރ ނޫން ޒިޔާރަތްކުރާ ފަރާތްތަކަށް ފޮރުވަން ޖެހުނު ނަމަވެސް، ކޮންމެ ފޯމެއް ކޮންޓްރޯލަކާއެކު އަބަދުވެސް އެއް ހިމަނަން ޔަގީން ކުރައްވާށެވެ .sr-only
.
އަދި ކަސްޓަމް ފޯމް ކޮންޓްރޯލްސް އާއި ސެލެކްޓްސް އަށް ވެސް ސަޕޯޓް ކުރެވެ އެވެ.
ފޮރުވިފައިވާ ލޭބަލްތަކުގެ ބަދަލުތަކެވެ
ސްކްރީން ރީޑަރ ފަދަ އެހީތެރި ޓެކްނޮލޮޖީތަކަށް ކޮންމެ އިންޕުޓަކަށް ލޭބަލް ނުހިމަނާނަމަ ފޯމްތަކަށް އުނދަގޫވާނެ އެވެ. .sr-only
މި އިންލައިން ފޯމްތަކަށް ކްލާސް ބޭނުންކޮށްގެން ލޭބަލްތައް ފޮރުވޭނެއެވެ . އެހީތެރި ޓެކްނޮލޮޖީތަކަށް ލޭބަލް ފޯރުކޮށްދިނުމަށް އިތުރު ބަދަލު ގޮތްތަކެއް އެބަހުއްޓެވެ، aria-label
, aria-labelledby
ނުވަތަ title
އެޓްރިބިއުޓް ފަދަ ގޮތްތައް ވެސް އެބަހުއްޓެވެ. މިއިން އެއްވެސް އެއްޗެއް ނެތްނަމަ، އެހީތެރި ޓެކްނޮލޮޖީތަކުން placeholder
އެޓްރިބިއުޓް ބޭނުންކުރުމަށް ރިޒޯޓް ކުރެވިދާނެ، ހުރިނަމަ، ނަމަވެސް placeholder
އެހެން ލޭބަލިންގ މެތޯޑްތަކުގެ ބަދަލުގައި ބޭނުންކުރުމަކީ ރަނގަޅު ކަމެއް ނޫންކަން ފާހަގަކުރައްވާށެވެ.
ފޯމްތަކުގައި ބްލޮކް ލެވެލްގެ ހެލްޕް ޓެކްސްޓް އުފައްދާލެވޭނީ ބޭނުންކޮށްގެން .form-text
(ކުރިން .help-block
v3 ގައިވާ ގޮތަށް) އެވެ. އިންލައިން ހެލްޕް ޓެކްސްޓް ފްލެކްސިބަލްކޮށް ތަންފީޒު ކުރެވޭނީ ކޮންމެ އިންލައިން އެޗްޓީއެމްއެލް އެލިމެންޓަކާއި ޔުޓިލިޓީ ކްލާސްތަކެއް ބޭނުންކޮށްގެންނެވެ .text-muted
.
އެހީގެ ލިޔުން ފޯމް ކޮންޓްރޯލްތަކާ ގުޅުވައިދިނުން
aria-describedby
ހެލްޕް ޓެކްސްޓް އެޓްރިބިއުޓް ބޭނުންކުރުމާ ގުޅޭ ފޯމް ކޮންޓްރޯލާ ސާފުކޮށް ގުޅިފައި އޮންނަންވާނެއެވެ . މިއީ އެސިސްޓިވް ޓެކްނޮލޮޖީތަކުން - ސްކްރީން ރީޑަރސް ފަދަ - ޔޫޒަރ ފޯކަސް ކުރާއިރު ނުވަތަ ކޮންޓްރޯލަށް ވަންނައިރު މި އެހީގެ ލިޔުން އިއުލާންކުރާނެކަން ކަށަވަރުވެގެންދާނެ ކަމެކެވެ.
އިންޕުޓްތަކުގެ ތިރީގައިވާ ހެލްޕް ޓެކްސްޓް ސްޓައިލް ކުރެވޭނީ .form-text
. މި ކްލާހުގައި display: block
މަތީގައިވާ އިންޕުޓްތަކުން ފަސޭހައިން ދުރުހެލިވުމަށްޓަކައި ކޮންމެވެސް ޓޮޕް މާރޖިންއެއް ހިމެނޭއިރު އިތުރުކޮށްފައިވެއެވެ.
ޕާސްވޯޑްގެ ދިގުމިނަކީ 8-20 އަކުރު، އަކުރުތަކާއި ނަންބަރުތައް ހިމެނޭ، އަދި ޖާގަ، ޚާއްޞަ އަކުރު، އިމޯޖީ ހިމެނޭ ޕާސްވޯޑަކަށް ވާންޖެހެއެވެ.
އިންލައިން ޓެކްސްޓްގައި ޔުޓިލިޓީ ކްލާހެއް ނޫން އެހެން އެއްޗެއް ނެތި ކޮންމެ އާދައިގެ އިންލައިން އެޗްޓީއެމްއެލް އެލިމެންޓެއް (އެއީ <small>
, , ނުވަތަ އެހެން އެއްޗެއް ވިޔަސް) ބޭނުންކުރެވިދާނެއެވެ.<span>
އިންޕުޓެއްގައި ބޫލިއަން އެޓްރިބިއުޓް އިތުރުކޮށް، disabled
ޔޫޒަރ އިންޓަރެކްޝަންތައް ހުއްޓުވައި، ލުއި ގޮތަކަށް ފެންނަ ގޮތަށް ހެދުމަށްޓަކައެވެ.
އެތެރޭގައި ހުރި ހުރިހާ ކޮންޓްރޯލްތަކެއް ޑިސެބިލް ކުރުމަށް disabled
އެޓްރިބިއުޓް a އަށް އިތުރުކުރުން .<fieldset>
ނަކަލުތަކާއެކު ކެވިއޭޓް ކުރާށެވެ
ބައި ޑިފޯލްޓްކޮށް، ބްރައުޒާތަކުން a ގެ ތެރޭގައި ހުންނަ ހުރިހާ ނެޓިވް ފޯމް ކޮންޓްރޯލްތައް ( <input>
, <select>
އަދި <button>
އެލިމެންޓްތައް) <fieldset disabled>
ޑިސެބިލް ކޮށްފައިވާ ގޮތަށް ބަލާނެ ކަމަށާއި، އެތަންތަނުގައި ކީބޯޑާއި މައުސް ވެސް މުއާމަލާތް ކުރުން ހުއްޓުވޭނެ ކަމަށެވެ. ނަމަވެސް ތިބާގެ ފޯމުގައި ވެސް <a ... class="btn btn-*">
އުނިއިތުރުތައް ހިމެނޭނަމަ، މިކަންކަމަށް ލިބޭނީ ހަމައެކަނި ގެ ސްޓައިލެކެވެ pointer-events: none
. ބަޓަންތަކަށް ޑިސެބިލްޑް ސްޓޭޓާ ބެހޭ ބައިގައި (އަދި ޚާއްޞަކޮށް އެންކަރ އެލިމެންޓްތަކަށް ސަބް ސެކްޝަންގައި) ފާހަގަކޮށްފައިވާ ފަދައިން، މި ސީއެސްއެސް ޕްރޮޕަޓީ އަދި ސްޓޭންޑަރޑައިޒް ނުވެ، އިންޓަރނެޓް އެކްސްޕްލޯރަރ 10 ގައި ފުރިހަމައަށް ސަޕޯޓް ނުކުރާތީ، ކީބޯޑް ބޭނުންކުރާ މީހުންނަށް އެކަން ހުރަހެއް ނާޅާނެއެވެ މި ލިންކްތަކަށް ފޯކަސް ނުވަތަ އެކްޓިވޭޓް ކުރެވޭނެ ގޮތް ހެދުން. އެހެންކަމުން ރައްކާތެރިވުމަށްޓަކައި މިފަދަ ލިންކްތައް ޑިސެބިލް ކުރުމަށް ކަސްޓަމް ޖާވާސްކްރިޕްޓް ބޭނުން ކުރާށެވެ.
ކްރޮސް ބްރައުޒާ ކޮމްޕެޓިބިލިޓީ
ބޫޓްސްޓްރެޕް އިން މި ސްޓައިލްތައް ހުރިހާ ބްރައުޒަރެއްގައި ވެސް އަމަލުކުރާނެ ނަމަވެސް، އިންޓަރނެޓް އެކްސްޕްލޯރަރ 11 އާއި ތިރީގައިވާ disabled
އެޓްރިބިއުޓް އަށް ފުރިހަމައަށް ސަޕޯޓް ނުކުރެއެވެ <fieldset>
. މި ބްރައުޒާތަކުގައި ހުންނަ ފީލްޑްސެޓް ޑިސެބިލް ކުރުމަށް ކަސްޓަމް ޖާވާސްކްރިޕްޓް ބޭނުން ކުރާށެވެ.
އެޗްޓީއެމްއެލް5 ފޯމް ވެލިޑޭޝަން އާއި އެކު ތިޔަބޭފުޅުންގެ ޔޫޒަރުންނަށް އަގުހުރި، ފިޔަވަޅު އެޅޭނެ ފީޑްބެކް ފޯރުކޮށްދިނުން– އަޅުގަނޑުމެންގެ ސަޕޯޓްކުރާ ހުރިހާ ބްރައުޒާތަކެއްގައި ލިބެން ހުންނާނެ . ބްރައުޒާ ޑިފޯލްޓް ވެލިޑޭޝަން ފީޑްބެކް އިން ޚިޔާރު ކުރައްވާ، ނުވަތަ އަޅުގަނޑުމެންގެ ބިލްޓް-އިން ކްލާސްތަކާއި ސްޓާޓަރ ޖާވާސްކްރިޕްޓް އާއެކު ކަސްޓަމް މެސެޖުތައް ތަންފީޒު ކުރައްވާ.
އަޅުގަނޑުމެން މިހާރު ލަފާދެނީ ކަސްޓަމް ވެލިޑޭޝަން ސްޓައިލްތައް ބޭނުންކުރުމަށެވެ، ސަބަބަކީ ނެޓިވް ބްރައުޒާ ޑިފޯލްޓް ވެލިޑޭޝަން މެސެޖުތައް ހުރިހާ ބްރައުޒާތަކެއްގައި (އެންމެ ފާހަގަކޮށްލެވޭ ޑެސްކްޓޮޕް އަދި މޯބައިލްގައި ކްރޯމް) އެހީތެރި ޓެކްނޮލޮޖީތަކަށް އެއްގޮތަކަށް ވެސް ހުށަހެޅިފައި ނުވާތީ އެވެ.
މިއީ ބޫޓްސްޓްރެޕް އާއި އެކު ފޯމް ވެލިޑޭޝަން މަސައްކަތްކުރާ ގޮތެވެ:
- އެޗްޓީއެމްއެލް ފޯމް ވެލިޑޭޝަން އެޕްލައި ކުރެވެނީ ސީއެސްއެސްގެ ދެ ސޫޑޯ ކްލާސް މެދުވެރިކޮށް،
:invalid
އަދި :valid
. އެއީ <input>
, <select>
, އަދި <textarea>
އުފެއްދުންތަކަށް އަމަލުކުރާ އެއްޗެކެވެ.
- ބޫޓްސްޓްރަޕް ސްކޯޕްސް ދަ
:invalid
އެންޑް :valid
ސްޓައިލްސް ޓު ޕޭރެންޓް .was-validated
ކްލާސް، އާންމުކޮށް އެޕްލައިޑް ޓު ދަ <form>
. އެހެން ނޫންނަމަ، އަގެއް ނެތް ކޮންމެ ބޭނުންވާ ފީލްޑެއް ޕޭޖް ލޯޑް ކުރާއިރު ސައްހަ ނޫން ކަމަށް ފެންނާނެއެވެ. މިގޮތަށް، އެތަކެތި އެކްޓިވޭޓް ކުރަންވީ ވަގުތު އިޚްތިޔާރު ކުރެވިދާނެ (އާންމުކޮށް ފޯމް ހުށަހެޅުމަށް މަސައްކަތް ކުރުމަށްފަހު) އެވެ.
- ފޯމްގެ ސިފަ ރީސެޓް ކުރުމަށްޓަކައި (މިސާލަކަށް، އެޖެކްސް ބޭނުންކޮށްގެން ޑައިނަމިކް ފޯމް ހުށަހެޅުމުގެ ހާލަތުގައި) ހުށަހެޅުމަށްފަހު އަނެއްކާވެސް
.was-validated
ކްލާސް ނައްތާލާށެވެ.<form>
- ފޯލްބެކެއްގެ ގޮތުގައި،
.is-invalid
އަދި ސަރވަރ ސައިޑް ވެލިޑޭޝަން.is-valid
އަށް ސޫޑޯ ކްލާސްތަކުގެ ބަދަލުގައި ކްލާސްތައް ބޭނުންކުރެވިދާނެއެވެ . އެމީހުންނަށް ބެލެނިވެރިންގެ ކްލާހެއް ބޭނުން ނުވާނެއެވެ..was-validated
<label>
ސީއެސްއެސް މަސައްކަތްކުރާ ގޮތުގައި ހުރި ދަތިތަކުގެ ސަބަބުން ، ކަސްޓަމް ޖާވާސްކްރިޕްޓްގެ އެހީ ނެތި، ޑީއޯއެމްގައި ފޯމް ކޮންޓްރޯލެއްގެ ކުރިން އަންނަ އެއްޗަކަށް ސްޓައިލްތައް އަޅުގަނޑުމެންނަށް (މިވަގުތު) އެޕްލައި ނުކުރެވޭނެއެވެ .
- މިޒަމާނުގެ ހުރިހާ ބްރައުޒާތަކުން ވެސް ފޯމް ކޮންޓްރޯލްތައް ވެލިޑޭޓް ކުރުމަށް ބޭނުންކުރާ ޖާވާސްކްރިޕްޓް މެތޯޑްތަކުގެ ސިލްސިލާއެއް ކަމަށްވާ ކޮންސްޓްރެއިންޓް ވެލިޑޭޝަން އެޕީއައި އަށް ސަޕޯޓް ކުރެއެވެ.
- ފީޑްބެކް މެސެޖުތަކުގައި ބްރައުޒާ ޑިފޯލްޓްތައް (ކޮންމެ ބްރައުޒަރަކަށް ތަފާތު، އަދި ސީއެސްއެސް މެދުވެރިކޮށް ސްޓައިލް ނުކުރެވޭ) ނުވަތަ އިތުރު އެޗްޓީއެމްއެލް އަދި ސީއެސްއެސް އާއި އެކު އަޅުގަނޑުމެންގެ ކަސްޓަމް ފީޑްބެކް ސްޓައިލްތައް ބޭނުންކުރެވިދާނެއެވެ.
setCustomValidity
ޖާވާސްކްރިޕްޓްގައި އާއެކު ކަސްޓަމް ވެލިޑިޓީ މެސެޖުތައް ފޯރުކޮށްދެވިދާނެއެވެ .
އެކަން ވިސްނައިގެން، އަޅުގަނޑުމެންގެ ކަސްޓަމް ފޯމް ވެލިޑޭޝަން ސްޓައިލްތަކާއި، އިޚްތިޔާރީ ސަރވަރ ސައިޑް ކްލާސްތަކާއި، ބްރައުޒާ ޑިފޯލްޓްތަކަށް ތިރީގައިވާ ޑެމޯތަކަށް ވިސްނާލާށެވެ.
novalidate
ކަސްޓަމް ބޫޓްސްޓްރެޕް ފޯމް ވެލިޑޭޝަން މެސެޖުތަކަށް، ތިބާގެ އަށް ބޫލިއަން އެޓްރިބިއުޓް އިތުރުކުރަން ޖެހޭނެއެވެ <form>
. މިއީ ބްރައުޒާ ޑިފޯލްޓް ފީޑްބެކް ޓޫލްޓިޕްސް ޑިސެބިލް ކުރާ ކަމެއް ނަމަވެސް އަދިވެސް ޖާވާސްކްރިޕްޓްގައިވާ ފޯމް ވެލިޑޭޝަން އެޕީއައިތަކަށް އެކްސެސް ލިބިގެންދާ ކަމެކެވެ. ތިރީގައިވާ ފޯމު ހުށަހަޅަން މަސައްކަތް ކުރާށެވެ؛ އަޅުގަނޑުމެންގެ ޖާވާސްކްރިޕްޓް އިން ސަބްމިޓް ބަޓަން އިންޓަސެޕްޓްކޮށް ފީޑްބެކް ރިލޭ ކުރާނެއެވެ.
ހުށަހަޅަން އުޅޭއިރު، ތިބާގެ ފޯމް ކޮންޓްރޯލްތަކަށް އަމަލުކުރާ :invalid
އަދި ސްޓައިލްތައް ފެންނާނެއެވެ.:valid
ކަސްޓަމް ވެލިޑޭޝަން ފީޑްބެކް މެސެޖުތަކަށް ނުވަތަ ފޯމް ސުލޫކުތައް ބަދަލުކުރުމަށް ޖާވާސްކްރިޕްޓް ލިޔުމަށް ޝައުގުވެރި ނުވޭތޯ؟ ހުރިހާ ކަމެއް ރަނގަޅު، ބްރައުޒާ ޑިފޯލްޓްތައް ބޭނުން ކުރެވޭނެ. ތިރީގައިވާ ފޯމު ހުށަހަޅަން މަސައްކަތް ކުރާށެވެ. ބްރައުޒާ އާއި އޮއެސް އަށް ބަލާއިރު ތަންކޮޅެއް ތަފާތު ސްޓައިލެއްގެ ފީޑްބެކް ފެންނާނެ އެވެ.
މި ފީޑްބެކް ސްޓައިލްތައް ސީއެސްއެސް އިން ސްޓައިލް ނުކުރެވުނު ނަމަވެސް، އަދިވެސް ޖާވާސްކްރިޕްޓް މެދުވެރިކޮށް ފީޑްބެކް ޓެކްސްޓް ކަސްޓަމައިޒް ކުރެވޭނެއެވެ.
އަޅުގަނޑުމެން ލަފާދެނީ ކްލައިންޓް ސައިޑް ވެލިޑޭޝަން ބޭނުންކުރުމަށް، އެކަމަކު ސަރވަރ ސައިޑް ބޭނުންވާ ހާލަތެއްގައި، އަދި އިން ސައްހަ ނޫން އަދި ސައްހަ ފޯމް ފީލްޑްތައް .is-invalid
ދައްކާލެވޭނެއެވެ .is-valid
. .invalid-feedback
މި ކްލާސްތަކާއެކު ވެސް ސަޕޯޓް ކުރެވޭކަން ފާހަގަކޮށްލެވެއެވެ .
ސަޕޯޓް ކުރެވޭ އުފެއްދުންތައް
އަޅުގަނޑުމެންގެ މިސާލު ފޯމްތަކުން މަތީގައިވާ ނެޓިވް ޓެކްސްޗުއަލް <input>
s ދައްކާފައިވީނަމަވެސް، ފޯމް ވެލިޑޭޝަން ސްޓައިލްތައް އަޅުގަނޑުމެންގެ ކަސްޓަމް ފޯމް ކޮންޓްރޯލްތަކަށް ވެސް ލިބެން ހުރެއެވެ.
ތިބާގެ ފޯމް ލޭއައުޓް އިން އެކަން ހުއްދަކުރާނަމަ، ސްޓައިލްކޮށްފައިވާ ޓޫލްޓިޕްއެއްގައި ވެލިޑޭޝަން ފީޑްބެކް ދައްކާލުމަށްޓަކައި ކްލާސްތައް .{valid|invalid}-feedback
ކްލާސްތަކަށް ބަދަލުކުރެވިދާނެއެވެ. ޓޫލްޓިޕް ޕޮޒިޝަނިންގ އަށް .{valid|invalid}-tooltip
ބެލެނިވެރިއަކު އޭގައި ހުންނަކަން ޔަގީން ކުރައްވާށެވެ . position: relative
ތިރީގައިވާ މިސާލުގައި، އަޅުގަނޑުމެންގެ ކޮލަމް ކްލާސްތަކުގައި މިކަން މިހާރުވެސް ހުރި ނަމަވެސް، ތިޔަބޭފުޅުންގެ ޕްރޮޖެކްޓަށް ބަދަލު ސެޓަޕްއެއް ބޭނުންވެދާނެއެވެ.
އިތުރަށް ކަސްޓަމައިޒޭޝަން އަދި ކްރޮސް ބްރައުޒާ ކޮންސިސްޓެންސީއަށްޓަކައި، ބްރައުޒާ ޑިފޯލްޓްތައް ބަދަލުކުރުމަށް އަޅުގަނޑުމެންގެ މުޅިން ކަސްޓަމް ފޯމް އެލިމެންޓްތައް ބޭނުންކުރައްވާށެވެ. އެއީ ސެމެންޓިކް އަދި އެކްސެސިބަލް މާކަޕްގެ މައްޗަށް ބިނާކޮށްފައިވާ އެއްޗެހި ކަމުން އެއީ ކޮންމެ ޑިފޯލްޓް ފޯމް ކޮންޓްރޯލަކަށް ވެސް ސޮލިޑް ރިޕްލޭސްމަންޓްތަކެކެވެ.
ޗެކްބޮކްސްތަކާއި ރޭޑިއޯތަކެވެ
ކޮންމެ ޗެކްބޮކްސްއަކާއި ރޭޑިއޯއެއް ވެސް އަޅުގަނޑުމެންގެ ކަސްޓަމް ކޮންޓްރޯލް އުފެއްދުމަށްޓަކައި <div>
އެއްބަނޑު އެއްބަފާ މީހާއާއެކު އެއް އޮޅާފައި ހުންނައިރު ، އެއާއެކު ލިޔެފައިވާ ލިޔުމަށް އޭ އެއް އޮޅާފައި ހުރެއެވެ. ސްޓްރަކްޗަރަލް ގޮތުން ބަލާއިރު، މިއީ އަޅުގަނޑުމެންގެ ޑިފޯލްޓް .<span>
<label>
.form-check
އަޅުގަނޑުމެންގެ ކަސްޓަމް ފޯމް އިންޑިކޭޓަރ ރަނގަޅަށް ސްޓައިލް ކުރުމަށްޓަކައި އަޅުގަނޑުމެންގެ ހުރިހާ ސްޓޭޓްތަކަށް އެއްބަނޑު އެއްބަފާ ސެލެކްޓަރ ( ~
) ބޭނުންކުރަމެވެ. ކްލާހާއި ގުޅިގެން ކުރާއިރު ، ކޮންމެ އެއްޗެއްގެ ޓެކްސްޓް ވެސް ސްޓައިލް ކުރެވޭނީ 's ސްޓޭޓް' އަށް ބަލައިގެންނެވެ.<input>
:checked
.custom-control-label
<input>
އަޅުގަނޑުމެން ޑިފޯލްޓް ފޮރުވަނީ އާއި <input>
އެކު opacity
އަދި ބޭނުންކުރަނީ .custom-control-label
އޭގެ ބަދަލުގައި އާ ކަސްޓަމް ފޯމް އިންޑިކޭޓަރެއް ބިނާކުރުމަށް ::before
އަދި އާއި އެކުގައެވެ ::after
. ހިތާމައަކީ އަޅުގަނޑުމެންނަށް ކަސްޓަމް އެއް ބިލްޑް ނުކުރެވޭނެ ހަމައެކަނި އިން <input>
ސަބަބަކީ ސީއެސްއެސް އިން content
އެ އެލިމެންޓަށް މަސައްކަތް ނުކުރާތީ.
ޗެކް ކުރެވިފައިވާ ސްޓޭޓްތަކުގައި، އަޅުގަނޑުމެން ބޭނުންކުރަނީ އޯޕަން އައިކޮނިކް އިން base64 އެންބެޑެޑް އެސްވީޖީ އައިކޮންސް އެވެ . މިއީ ބްރައުޒާތަކާއި ޑިވައިސްތަކުގެ ތެރެއިން ސްޓައިލިންގ އާއި ޕޮޒިޝަން ކުރުމަށް އެންމެ ރަނގަޅު ކޮންޓްރޯލެއް އަޅުގަނޑުމެންނަށް ލިބިގެންދާ ކަމެކެވެ.
ކަސްޓަމް ޗެކްބޮކްސްތަކުން ވެސް :indeterminate
ޖާވާސްކްރިޕްޓް މެދުވެރިކޮށް މެނުއަލްކޮށް ސެޓް ކުރާއިރު ސޫޑޯ ކްލާސް ބޭނުންކުރެވިދާނެ (އެކަން ކަނޑައެޅުމަށް ލިބޭ އެޗްޓީއެމްއެލް އެޓްރިބިއުޓެއް ނެތެވެ).
ޖީކުއަރީ ބޭނުންކުރާނަމަ މިފަދަ އެއްޗެއް ފުދޭނެއެވެ:
އަދި ކަސްޓަމް ޗެކްބޮކްސްތަކާއި ރޭޑިއޯތައް ވެސް ޑިސެބިލް ކުރެވިދާނެ އެވެ. disabled
އަށް ބޫލިއަން އެޓްރިބިއުޓް އިތުރުކޮށް <input>
ކަސްޓަމް އިންޑިކޭޓަރާއި ލޭބަލް ޑިސްކްރިޕްޝަން އޮޓޮމެޓިކުން ސްޓައިލް ކުރެވޭނެއެވެ.
ކަސްޓަމް <select>
މެނޫތަކަށް ބޭނުންވަނީ ހަމައެކަނި ކަސްޓަމް ކްލާހެއް، .custom-select
ކަސްޓަމް ސްޓައިލްތައް ޓްރިގަރ ކުރުމަށެވެ. ކަސްޓަމް ސްޓައިލްތައް ލިމިޓް ކުރެވިފައިވަނީ 's ގެ ފުރަތަމަ ފެންނަ ފެނުމަށް ކަމަށާއި ބްރައުޒާ ލިމިޓެޝަންތަކުގެ ސަބަބުން s އަށް <select>
ބަދަލު ނުކުރެވޭނެ ކަމަށެވެ .<option>
އަދި އަޅުގަނޑުމެންގެ އެއް ސައިޒެއްގެ ޓެކްސްޓް އިންޕުޓްތަކާ އެއްގޮތްވާ ގޮތަށް ކުދި އަދި ބޮޑެތި ކަސްޓަމް ސެލެކްޓްތަކުގެ ތެރެއިން ޚިޔާރުކުރެވިދާނެއެވެ.
އަދި multiple
އެޓްރިބިއުޓް އަށް ސަޕޯޓް ކުރެވެއެވެ:
size
އެޓްރިބިއުޓްގައިވާ ފަދައިން :
އާއެކު ކަސްޓަމް <input type="range">
ކޮންޓްރޯލްތައް އުފެއްދުން .custom-range
. ޓްރެކް (ބެކްގްރައުންޑް) އާއި ތަމް (ވެލިއު) ވެސް ސްޓައިލްކޮށްފައިވަނީ ބްރައުޒާތަކުގެ ތެރެއިން އެއްގޮތަކަށް ފެންނަ ގޮތަށެވެ. ހަމައެކަނި އައިއީ އާއި ފަޔަރފޮކްސް އިން އެމީހުންގެ ޓްރެކް އިނގިލީގެ އިނގިލީގެ ކަނާތްފަރާތުން ނުވަތަ ވާތްފަރާތުން “ފުރިހަމަ” ކުރުމަށް ސަޕޯޓްކުރާތީ، ކުރިއެރުންތައް ލޮލުން ފެންނަ ގޮތަށް ދައްކާލުމަށްޓަކައި، އަޅުގަނޑުމެން މިވަގުތު އެކަމަށް ސަޕޯޓް ނުކުރަމެވެ.
min
ރޭންޖް އިންޕުޓްތަކުގައި އަދި max
— 0
އަދި އަށް އިމްޕްލިސިޓް ވެލިއުތައް 100
ހުރެއެވެ. min
އަދި max
އެޓްރިބިއުޓްތައް ބޭނުންކުރާ ފަރާތްތަކަށް އާ އަގުތައް ކަނޑައެޅިދާނެއެވެ .
ބައި ޑިފޯލްޓްކޮށް، ރޭންޖް އިންޕުޓްސް އިންޓިޖަރ ވެލިއުތަކަށް “ސްނެޕް” ކުރެއެވެ. މިކަން ބަދަލުކުރުމަށްޓަކައި step
އަގެއް ކަނޑައެޅިދާނެއެވެ. ތިރީގައިވާ މިސާލުގައި އަޅުގަނޑުމެން ސްޓެޕްތަކުގެ އަދަދު ދެގުނައަށް އިތުރުކުރަނީ step="0.5"
.
ފައިލް އިންޕުޓަކީ ބަންޗްގެ ތެރެއިން އެންމެ ގްނާރލީ އެއް ކަމަށާއި، ފަންކްޝަނަލް ޗޫސް ފައިލް... އަދި ސެލެކްޓް ކޮށްފައިވާ ފައިލް ނަން ޓެކްސްޓާއެކު ހޫކް އަޕް ކުރަން ބޭނުންނަމަ އިތުރު ޖާވާސްކްރިޕްޓް ބޭނުންވާ ކަމަށެވެ .
އަޅުގަނޑުމެން ޑިފޯލްޓް ފައިލް ފޮރުވަނީ <input>
މެދުވެރިކޮށް opacity
އަދި އޭގެ ބަދަލުގައި ސްޓައިލް ކުރަނީ <label>
. މި ބަޓަން ޖެނެރޭޓްކޮށް ޕޮޒިޝަން ކުރެވިފައިވަނީ ::after
. އެންމެ ފަހުން އަޅުގަނޑުމެން ޑިކްލެއާ ކުރަނީ ވަށައިގެންވާ ކޮންޓެންޓަށް ރަނގަޅު ޖާގައެއް ހޯދުމަށްޓަކައި އޭ width
އަދި height
އޮން ދަ އަށް.<input>
ސްޓްރިންގްތައް ތަރުޖަމާކުރުން ނުވަތަ ކަސްޓަމައިޒްކުރުން
:lang()
ސޫޑޯ ކްލާސް ބޭނުންކުރަނީ “ބްރައުޒް” ލިޔުން އެހެން ބަސްބަހަށް ތަރުޖަމާ ކުރެވޭނެ ގޮތް ހެދުމަށެވެ. $custom-file-text
ކަމާބެހޭ ބަހުގެ ޓެގާއި ލޮކަލައިޒްޑް ސްޓްރިންގްތަކާއެކު ސާސް ވެރިއޭބަލްއަށް އެންޓްރީތައް އޮވަރރައިޑް ނުވަތަ އިތުރުކުރުން . އިނގިރޭސި ސްޓްރިންގްސް ވެސް ހަމަ އެގޮތަށް ކަސްޓަމައިޒް ކުރެވިދާނެ އެވެ. މިސާލަކަށް، މިއީ ސްޕެނިޝް ތަރުޖަމާއެއް އިތުރުކުރެވިދާނެ ގޮތް (ސްޕެނިޝް ބަހުގެ ކޯޑަކީ es
):
މިއީ lang(es)
ސްޕެނިޝް ތަރުޖަމާއަކަށް ކަސްޓަމް ފައިލް އިންޕުޓްގެ މައްޗަށް ޢަމަލުކުރަމުންދާ އެއްޗެކެވެ:
ރަނގަޅު ލިޔުން ދައްކާލުމަށްޓަކައި ތިބާގެ ލިޔުމުގެ ބަސް (ނުވަތަ އޭގެ ސަބްޓްރީ) ރަނގަޅަށް ސެޓް ކުރަން ޖެހޭނެއެވެ. މިކަން ކުރެވޭނީ އެލިމެންޓްގައި ހުންނަ lang
އެޓްރިބިއުޓް ނުވަތަ އެޗްޓީޓީޕީ ހެޑަރ ބޭނުންކޮށްގެން , އެހެނިހެން ގޮތްތަކުގެ ތެރެއިންނެވެ.<html>
Content-Language