Selasa, 30 April 2013

Cara Membuat Text Area pada Postingan Blog



Assalamu'alaikum...
alhamdulillah masih bisa posting hehehhe.... pada postingan kalo ini admin mau berbagi cara untuk membuat teks area pada postingan blog. langsung aja nih >>>

pilih dulu tab HTML untuk mengcopy-paste kode HTML di bawah 


 
A. Teks area sederhana
Kodenya :
<p align="center"><textarea name="code" rows="6" cols="20"> contoh memasukan kata atau code HTML pada text Area di Artikel Indonesia </textarea></p>
Hasilnya >>>
Keterangan :
dengan kode di atas maka tampilan teks area seperti di bawah ini. angka 6 berarti jumlah baris, 35 menunjukkan lebar form teks area.
Teks yang berwarna merah muda dapat diubah sesuai keinginan.

B. Teks Area dengan Select copy all
Kodenya :
<div><form name="copy"><div align="center"><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Copy All"> </div><div align="center"></div><p align="center"><textarea style="WIDTH: 300px; HEIGHT: 144px" name="txt" rows="100" wrap="VIRTUAL" cols="55">contoh memasukan kata atau code HTML pada text Area di Artikel Indonesia</textarea></p></div></form>

Hasilnya >>>
   
Keterangan :
Teks yang berwarna merah muda dapat diubah sesuai keinginan.

C. Membuat Teks area dengan scroll
Kodenya :
<div align="center">
<div style="border: 2px solid lightblue; height: 80px; margin-left: 30px; overflow: auto; padding: 3px; text-align: justify; width: 300px;">
Ini adalah contoh Scroll Text dengan tinggi 80px, border berukuran 2px berjenis solid dan berwarna lightblue, dengan menggunakan overflow berjenis auto, text-align berjenisjustify (rata kanan kiri), dengan batas margin kiri sebesar 30px, padding sebesar 3px, dan memiliki luas sebesar 300px.</div>
</div>
Hasilnya >>>
Ini adalah contoh Scroll Text dengan tinggi 80px, border berukuran 2px berjenis solid dan berwarna lightblue, dengan menggunakan overflow berjenis auto, text-align berjenisjustify (rata kanan kiri), dengan batas margin kiri sebesar 30px, padding sebesar 3px, dan memiliki luas sebesar 300px.
Keterangan :
Teks yang berwarna merah muda dapat diubah sesuai keinginan.

D. Scroll Text Area + Select Copy All
Kodenya :
<div align="center">
<div>
<form name="copy">
<div align="center">
<input onclick="javascript:this.form.txt.focus();this.form.txt.select();" type="button" value="Copy All" /> </div>
<div align="center">
</div>
<div align="center">
</div>
<div style="border: 2px solid lightblue; height: 80px; margin-left: 30px; overflow: auto; padding: 3px; text-align: justify; width: 300px;">
Ini adalah contoh Scroll Text dengan tinggi 80px, border berukuran 2px berjenis solid dan berwarna lightblue, dengan menggunakan overflow berjenis auto, text-align berjenisjustify (rata kanan kiri), dengan batas margin kiri sebesar 30px, padding sebesar 3px, dan memiliki luas sebesar 300px.</div>
</form>
</div> 
Hasilnya >>> 
Ini adalah contoh Scroll Text dengan tinggi 80px, border berukuran 2px berjenis solid dan berwarna lightblue, dengan menggunakan overflow berjenis auto, text-align berjenisjustify (rata kanan kiri), dengan batas margin kiri sebesar 30px, padding sebesar 3px, dan memiliki luas sebesar 300px.
Keterangan :
Teks yang berwarna merah muda dapat diubah sesuai keinginan.

Semoga bermanfaat ya, kalo ada yang kurang jelas comment aja.
dan jangan lupa follow alfatihmedia untuk terus dapet info dan tips-tips menarik, seee yaaaaaaaaaa :)

Tidak ada komentar:

Posting Komentar