Html Code Mengenal Fungsi dropdown, multiple drop, optgroup dan datalist

Contoh Kode dropdown

Html Code Mengenal dropdown, multiple drop, optgroup, datalist - dalam tutorial code html kali ini memang perlu kita cermati dengan tutorial html kali ini yang memang hal ini perlu kita pahami dalam penulisan script html programs yang kita pahami.

sebelum kita memahami lebih dalam tentang fungsi html code dorpdown, kita wajib tahu tentang maksud dari code tersebut dan kapan kode kode html tersebut di gunakan, mari kita mulai dengan tujuan kode html tersebut.

fungsi dan tujuan kode html dropdown & sejenisnya.

• untuk membuat sitem pilihan dalam media form html.
• menampilkan data dalan bentuk simple list dalam box list show.
• Data input tanpa perlu mengetik tingal klik & klik data html akan terimput langsung.
• Data di simpan dalam input akan lebih sedikit memakan tempat karen terkunpul dalam 1 form list.
• data yang masuk akan lebih akurat sesuai pilihan anda.
• bisa untum membuat pilihat ganda dalam form dan jawaban.

setelah kita tahu fungsi dan tujuan tutorial html dropdownmungkin teman teman masih bingung tanpa contohnya seperti apa sih kode html tersebut, untuk itu mari kita lihat dulu contohnya agar dalam tutorial html kali ini tidak bingung.

Contoh Html Dropdown

      Contoh data dropdown      Contoh html source      tag html kode      script html tag      kode html kode    

dari hasil di atas mungkin ada sedikit gambaran tentang kode html tersebut, untuk cara membuat select dropdown tersebut mari kita lihat script html kode di bawah ini.

Kode Html Select Option

script html select

 <select> 

    <option value="1">satu</option> 

    <option value="2">dua</option> 

    <option value="3">tiga</option> 

    <option value="4">empat</option> 

    <option value="5">lima</option> 

  </select> 

hasilnya bisa dilihat di bawah ini langsung

      satu      dua      tiga      empat      lima     

Html select multiple dropdown

script html

 <select multiple> 

    <option value="1">pertama</option> 

    <option value="2">kedua</option> 

    <option value="3">ketiga</option> 

    <option value="4">keempat</option> 

    <option value="5">kelima</option> 

  </select> 

hasilnya kode kode di maksud bisa di lihat di bawah

       pertama      kedua      ketiga      keempat      kelima     

Html kode select group dropdown

script html

 <select> 

   

    <optgroup label="Group 1"> 

      <option>Option 1.1</option> 

    </optgroup>  

 

    <optgroup label="Group 2"> 

      <option>Option 2.1</option> 

      <option>Option 2.2</option> 

    </optgroup> 

 

    <optgroup label="Group 3" disabled> 

      <option>Option 3.1</option> 

      <option>Option 3.2</option> 

      <option>Option 3.3</option> 

    </optgroup> 

 

</select> 

Hasilnya di lihat di bawah ini.

                   Option 1.1                        Option 2.1        Option 2.2                      Option 3.1        Option 3.2        Option 3.3           

Html select datalist dropdown

script html

<label>contoh pencarian : 

  <input list="namelist" /></label> 

 

 <datalist id="kode html"> 

    <option value="script code"> 

    <option value="programs code"> 

    <option value="data html"> 

    <option value="totorial html"> 

    <option value="html source kode"> 

    <option value="html tag"> 

    <option value="kode html kode"> 

  </datalist> 

Kode di atas terlihat di bawah ini

 contoh pencarian : 

Kode list akan terlihat saat di tekan dan datanya akan muncul dengan kriteria dimaksud.

Akhirnya kita pahami secript html dropdown yang dinmaksud untuk pengaplikasian script programs bisa anda berinovasi sendiri menurut kriteria anda.

Semoga pelajaran html kali ini bisa cukup membuat anda memahami script html secara perlahan dan terus menerus, memang dalam pelajaran html mengingat dan menghafalkan kode adalah suatu hal yang harus kita lakukan dalan pemaham html source tersebut.

Sekian dan terima kasih ............

Share this

Author : admin

Related Posts