Cara Membuat Textbox di Website/Blog oleh Ridho Bahri! Lihat Caranya Disini! - ridhobahrisoftware

10 March 2018

Cara Membuat Textbox di Website/Blog oleh Ridho Bahri! Lihat Caranya Disini!



Ditulis oleh Muhamad Ridho Bahri

RidhoBahriSoftware.com. Oke Kembali lagi bersama saya ridho bahri pada artikel kali ini saya akan membahas tentang

"Cara Membuat Textbox di Website/Blog"


Oke kita langsung saja kita masuk ke topik pertama
pada artikel kali ini, jangan lupa siapkan kopi hangat beserta kue bolu untuk pelengkap manis artikel blog pada kali ini..

Pembahasan Singkat
apa itu "Textbox di Website/Blog"




Kotak teks, adalah elemen kontrol grafis yang dimaksudkan untuk memungkinkan pengguna memasukkan informasi teks yang akan digunakan oleh program. Panduan Antarmuka Manusia Merekomendasikan satu baris kotak teks bila hanya satu baris masukan yang diperlukan, dan kotak teks multi-baris hanya jika satu masukan lebih dari satu baris mungkin diperlukan. Kotak teks yang tidak dapat diedit dapat berfungsi dengan hanya menampilkan teks.

Kotak teks khas adalah persegi panjang dengan berbagai ukuran, mungkin dengan batas yang memisahkan kotak teks dari bagian antarmuka lainnya. Kotak teks mungkin berisi nol, satu, atau dua scrollbar. Kotak teks biasanya menampilkan kursor teks (biasanya garis vertikal yang berkedip), yang menunjukkan wilayah teks saat ini sedang diedit. Adalah umum bagi kursor mouse untuk mengubah bentuknya saat melayang di atas kotak teks.



Oke Sobat, Tahap yang harus dilakukan untuk membuat text box di blog :

1. Masuk / Login ke akun Blogger sobat
2. Pilih ENTRI BARU
3. Buatlah tulisan tulisan
4. Kemudian Pilih HTML, pada pojok kiri atas
5. Masukan  salah satu  Kode dibawah
6. Kemudian Compose
7. Setelah itu copy tulisan yang telah anda buat
8. Dan Paste ke dalam kotak text

Berikut kotak teks untuk post di blog dengan Border (bingkai/garis batas)

<div style="border: 3px #1780dd Double; padding: 10px;background-color:#ffffff;
text-align: left;">masukan tulisan anda disini</div>

Keterangan:
border: 3px merupakan ketebalan garis pinggir kotak teks
#1780dd warna garis batas/ pinggir kotak teks
Double adalah bentuk dari garis batas pada pinggir kotak teks
padding: 10px merupakan panjang kotak teks dari atas ke bawah
background-color:#ffffff adalah warna latar belakan dari kotak teks
text-align: left  posisi kotak teks (text box) di bagian sisi kiri


Berikut dibawah ini contoh script untuk bentuk kotak teks :


masukan tulisan anda disini (Dotted).

Kode Html:
<div style="background-color: white; border: 3px #1780dd dotted; padding: 10px; text-align: left;">
masukan tulisan anda disini (Dotted)</div>


masukan tulisan anda disini (Dashed)

<div style="background-color: white; border: 3px #1780dd dashed; padding: 10px; text-align: left;">
masukan tulisan anda disini (Dashed)</div>


masukan tulisan anda disini (Solid)

<div style="background-color: white; border: 3px #1780dd solid; padding: 10px; text-align: left;">
masukan tulisan anda disini (Solid)</div>


masukan tulisan anda disini (Groove)

<div style="background-color: white; border: 3px #1780dd groove; padding: 10px; text-align: left;">
masukan tulisan anda disini (Groove)</div>


masukan tulisan anda disini (Inset)

<div style="background-color: white; border: 3px #1780dd inset; padding: 10px; text-align: left;">
masukan tulisan anda disini (Inset)</div>


masukan tulisan anda disini (Ridge)

<div style="background-color: white; border: 3px #1780dd ridge; padding: 10px; text-align: left;">
masukan tulisan anda disini (Ridge)</div>


masukan tulisan anda disini (outset)

<div style="background-color: white; border: 3px #1780dd outset; padding: 10px; text-align: left;">
masukan tulisan anda disini (outset)</div>


Untuk kode script html kotak text yang tidak memiliki border dibawah ini script htmlnya:


Tanpa Border

Kode script Html:

<div style="background-color: #f3f3f3; padding: 10px; text-align: left;">
masukan text disini
</div>




Sekian dan terima kasih kepada sobat yang telah membaca artikel ini hingga selesai. semoga ilmu yang saya sampaikan pada situs ini memberikan banyak manfaat pada kita semua.

No comments:

Attention:
You are Forbidden to Comment Hate, Say Rude, .etc do not do that. thank you

LINK

Google Play Store Link

Apple Store Link
Saat ini Tidak Tersedia