Cara Mengganti Warna Placeholder Dengan CSS


Cara Mengganti Warna Placeholder Dengan CSS

Cara Mengganti Warna Placeholder Dengan CSS – apa kabar teman-teman sekalian. hehe.. semoga sehat selalu ya. bertemu lagi lewat tulisan ini. kali ini kita akan membahas tentang cara mengganti warna placeholder dengan CSS. seperti yang telah kita ketahui bersama, placeholder merupakan salah satu fitur baru di HTML5. placeholder sudah banyak di gunakan di hampir semua design website di tahun 2016. sudah dari beberapa tahun lalu sih sebenarnya. tetapi di tahun 2016 ini semakin banyak yang menggunakan placeholder untu memberikan penamaan pada form. ketika mendapatkan beberapa project membuat aplikasi, saya sendiri terkadang sering menggunakan placeholder pada form.

Pengertian Placeholder

Akan saya jelaskan juga pengertian placeholder dan cara menggunakan placeholder pada form. karena mungkin ada teman-teman yang baru mulai belajar dan baru mengetahui tentang placeholder ini.

Placeholder adalah fitur dari HTML5. placeholder berguna untuk membuat semacam penamaan pada form. biasanya di gunakan untuk memberikan nama pada form.tetapi letakkan berada di dalam form. dan tulisan nya pun tidak akan berpengaruh atau mengganggu saat di submit. baca juga tutorial penanganan form dengan php.

Langsung saja masuk ke contoh placeholder pada form. biar lebih jelas nya. karena saya sendiri juga kurang pinter menjelaskan secara bahasa. hehe..

Cara Membuat Dan Menggunakan Placeholder

Untuk membuat placeholder pada form, kita tinggal menambahlan atribut “placeholder” dan isi kan value nya dengan text yang ingin di tampilkan pada form. contohnya :

index.html

cara membuat dan menggunakan placeholder

cara membuat dan menggunakan placeholder

Seperti yang teman-teman lihat pada gambar di atas. itulah fungsi dari placeholder. untuk membuat tulisan dengan tujuan memberikan penamaan pada form. nah sampai di sini kita sudah bisa membuat placeholder. lalu langkah selanjutnya bagaimana cara merubah warna tulisan placeholder? agar lebih menarik. langsung saja buat file css nya.

index.html

style.css

hasilnya.

cara mengganti warna placeholder dengan css

cara mengganti warna placeholder dengan css

seperti yang teman-teman lihat pada contoh di atas. terdapat 3 buah contoh form yang saya buat dengan menggunakan placeholder juga. coba perhatikan pada css nya.

agar di support di google chsome gunakan ::-webkit-input-placeholder, untuk support di mozila gunakan :-moz-input-placeholder. dan untuk support di internet explorer gunakan -ms-input-placeholder.

Untuk design form lebih lanjut nya perhatikan pada form contoh 3. hilagkan garis pinggir dan outline nya saat focus. berikan backround nya transparent agar tembus pandang alias tidak memiliki warna. jadi warna yang di ambil adalah warna background nya.

Oke sekian dulu tutorial kali ini tentang Cara Mengganti Warna Placeholder Dengan CSS. semoga bermanfaat.

baca juga tutorial lainnya di malasngoding.com:

Incoming search terms:

  • pengertian placeholder
  • cara mengganti warna placeholder
  • bagaimana cara mengganti warna placeholder
  • Pengertian Place holder
  • penjelasan placeholder
  • placeholder berguna untuk
  • placeholder adalah
  • Pengertian dari placeholder
  • cara mengganti warna place holder
  • pengertian pleace holder




About the author
Diki Alfarabi Hadi

Coding enthusiast. Someone who love learn something new. especially about web programming and web design. happy to share about knowledge and learn from other.


Discussion
  • One Comment

Write a Comment

Your email address will not be published. Required fields are marked *


CENTANG untuk bisa mengirimkan komentar. [ Verifikasi bukan robot ]