Labari ya kufupishwa cha form cha Bootstrap 5

Tabia inayofanywa kwenye juu/kifanyo cha mifano

Kwa kawaida, kwa kutumia label, wanaonekana kwenye juu ya eneo la kichaji:

Kwa kutumia tabia inayofanywa kwenye eneo la kichaji, unaweza kuongeza label kwenye eneo la kichaji na kuzifanya kwenda juu/kufanywa mifano kwa kichaji kilichopewa kichaji:

Mfano

<div class="form-floating mb-3 mt-3">
  <input type="text" class="form-control" id="email" placeholder="ingiza ari ya barua pepe" name="email">
  <label for="email">Barua pepe</label>
</div>
<div class="form-floating mt-3 mb-3">
  <input type="text" class="form-control" id="pwd" placeholder="Tafadhali ingiza neno la siri" name="pswd">
  <label for="pwd">Neno la siri</label>
</div>

Jifunze tena

Mambo ya kumwambia kuhusu Kitabu cha kifaa:

<label>Elementi ya <label> inahitaji kuwa kwa sababu ya <input> elementi, na kila <input> elementi inahitaji placeholder Mafanikio (ingawa hayajifadhihiwa).

Kipakurana

Hata zinaenea kwenye eneo la kipakurana:

Mfano

<div class="form-floating">
  <textarea class="form-control" id="comment" name="text" placeholder="Maraa hii inahitaji kuhitaji"></textarea>
  <label for="comment">Maraa</label>
</div>

Jifunze tena

Orodha ya chaguo

Wewe pia unaweza kutumia 'Kitabu cha kifaa' katika orodha ya chaguo. Kama hivyo, hawana watu wengi ambao wana uharibifu / uharibifu. Label zitaonyeshwa kwa eneo la juu la kizini cha orodha ya chaguo zote:

Mfano

<div class="form-floating">
  <select class="form-select" id="sel1" name="sellist">
    <option>1</option>
    <option>2</option>
    <option>3</option>
    <option>4</option>
  </select>
  <label for="sel1" class="form-label">Chagua orodha (chagua moja):</label>
</div>

Jifunze tena