free website hit counter Cara Membuat Text Area Box, Highlight All, dan Text Scroll

Cara Membuat Text Area Box, Highlight All, dan Text Scroll

Iklan
Iklan

Sudah lama Mafia Online tidak pernah memposting artikel. Pada kesempatan ini Mafia Online mencoba untuk berbagi sesuatu kepada teman-teman neter. Postingan kali ini akan membahas cara membuat text box atau text area juga sering disebut sebagai kotak teks, cara membuat kotak teks dengan highlight all, dan cara membuat kotak teks dengan fungsi scroll. Kenapa Mafia Online memposting artikel seperti ini?
Tujuan utamanya adalah sebagai koleksi pribadi kami, jika ingin membuat ingin membuat kotak teks tinggal membuka halaman ini. Mafia Online memposting artikel seperti ini juga karena blog kami yang berjudul Materi Mafia Online baru-baru ini memodifikasi blog tersebut dengan menggunakan texs area.

Cara Membuat Kotak Teks (Text Area)
Terkadang di dalam postingan kita ingin buat kotak teks (text area), di dalam kotak teks bisa diisi dengan teks, link, banner, gambar, dan lain sebagainya. Bagian terpenting dalam membuat teks box adalah:
  • Teks rata tengah = text-align: center; center bisa diganti dengan left, right, justify
  • Background warna = background-color: #cf32f3 bisa Anda ubah sesuai warna yang di inginkan
  • Border = border: 1px solid, bisa Anda atur ketebalan garis luarnya

Untuk membuatnya cukup mudah, silahkan copy kode dibawah ini:
Code 1:
<div style="border: 2px #1B1A76 dotted; padding: 10px; background-color:#c2c2c2; text-align: left;">
....text....</div>


Hasilnya seperti dibawah ini:
....text....


Code 2:
.<div style="border: 3px #006400 inset; padding: 10px; background-color:#d5839f;
text-align: left;">
....text....</div>

Hasilnya seperti dibawah ini:
....text....

Code 3:
<div style="border: 3px #5f200e outset; padding: 10px; background-color:#d9da81;
text-align: left;">
....text....</div>

Hasilnya seperti dibawah ini:
....text....

Code 4:

<div style="background-color: #82cafa; border: 3px #5f200e double; padding: 10px; text-align: left;">
....text....</div>

Hasilnya seperti dibawah ini:
....text....

Code 5:



<div style="background-color: #57aa52; border: 2px #610b38 dashed; padding: 10px; text-align: left;">
....text....</div>

Hasilnya seperti dibawah ini:
....text....



Cara Membuat Kotak Teks Dengan Highlight All
Jika anda ingin lebih efektif bisa menggunakan Highlight all ketimbang text area karena kita hanya perlu menekan tombol highlight all saja maka semua tulisan yang ada dikotak area bisa dicopy. Untuk membuatnya cukup mudah, silahkan copy kode dibawah ini:

<div><form name="copy"><div align="center"><span><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" value="Highlight All" type="button"> </span></div><p align="center"><textarea style="width: 180px; height: 80px;" name="txt" rows="4" wrap="VIRTUAL" cols="20"><a href='http://www.mafiaol.com' title='Mafia Online' target='_blank'>Mafia Link</a></textarea></p></form></div>

Hasilnya seperti di bawah ini:


Cara Membuat Kotak Teks Dengan Fungsi Scroll
Membuat text area memerlukan banyak tempat jika artikel yang kita jadikan tekt area sangat banyak jumlahnya. Oleh karena itu ada solusi agar tidak memerlukan banyak tempat yaitu dengan menggunkan fungsi scroll. Untuk membuatnya cukup mudah, silahkan copy kode dibawah ini:

<div style="font: 16px/26px Georgia, Garamond, Serif; height: 120px; overflow: scroll; width: 250px;">Terima Kasih Atas Kunjungan Anda. Tolong kritik dan sarannya yang membangun agar blog ini menjadi lebih baik. Punya artikel tentang “Mafia”, artikel tentang Aplikasi “Mafia” dalam kehidupan sehari-hari, soal-soal “Mafia”, Tips dan Trik mengerjakan Soal-Soal “Mafia”, Puisi “Mafia”, Pantun “Mafia”, atau yang lainnnya tentang “Mafia”? Jika pengen karyamu bisa kami terbitkan di blog ini silahkan kunjungi halaman berikut ini untuk “Mengirim Kreatifitas Anda”</div><div style="font-size: 10px;"></div>

Hasilnya seperti di bawah ini:

Terima Kasih Atas Kunjungan Anda. Tolong kritik dan sarannya yang membangun agar blog ini menjadi lebih baik. Punya artikel tentang “Mafia”, artikel tentang Aplikasi “Mafia” dalam kehidupan sehari-hari, soal-soal “Mafia”, Tips dan Trik mengerjakan Soal-Soal “Mafia”, Puisi “Mafia”, Pantun “Mafia”, atau yang lainnnya tentang “Mafia”? Jika pengen karyamu bisa kami terbitkan di blog ini silahkan kunjungi halaman berikut ini untuk “Mengirim Kreatifitas Anda”


Demikianlah cara membuat text area atau teks kotak. Semoga artikel ini bermanfaat buat kita semua.

Iklan

Subscribe to receive free email updates:

0 Response to "Cara Membuat Text Area Box, Highlight All, dan Text Scroll"

Post a Comment