بِسْــــــــــــــــمِ اﷲِالرَّØْÙ…َÙ†ِ الرَّØِيم
Text Area. Dalam bahasa Indonesia yang dapat diartikan yaitu menempatkan beberapa kata atau kalimat ke dalam sebuah area supaya text menjadi jelas. Dalam artian konteksnya menjadi lebih tertata.
Tujuan lain dengan diadakannya Text Area adalah merapikan kalimat dalam sebuah wadah. Sehingga kata-kata yang dihimpun tidak melebar kemana-mana. Memang menjadi hal yang dibilang perlu dalam penulisan di postingan.
Baca Juga : Membuat Dropcap atau Huruf Pertama Besar Pada Artikel di Blog Postingan
Bermacam-macam bentuk Text Area bisa menjadi teks yang ada di dalamnya menjadi lebih kontras dari yang lainnya. Misal background dari text area adalah hitam dengan tulisan putih, maka tulisan itu jelas terbaca.
Sekarang kami akan membuat beberapa variasi text area, meski sudah jarang dipakai dalam format penulisan di blog. Tetapi kami tetap akan menghadirkan dalam artikel ini.
Baca Juga : Modifikasi Spoiler Show Hidden dengan CSS dan HTML
Karena bagaimanapun, nostalgia adalah hal yang akan kita rasakan ketika kita mengingat hal-hal yang telah lampau dan memiliki kenangan tersendiri. Tidak ubahnya perjalanan hidup yang akan terulang kembali, REINKARKASI. Wuihhhh. Puitis ya
Okelah kalau begitu tidak usah panjang lebar ya. Kita mulai saja tutorialnya :
Variasi Text Area dengan CSS di Postingan
Langsung ke Postingan Baru
Masukkan kode dibawah diantara postingan yang akan dibuat.
Dibawah ini kodenya dan Contohnya :
<textarea name="code" rows="4" cols="40" style="background:#800000; color:#ffffff; border: 3px inset #00bfff; line-height: 1.5em; padding: 0 7px; -moz-border-radius: 10px;">Tulisan yang akan kamu tulis disini</textarea>Hasilnya :
<textarea name="code" rows="4" cols="40" style="background:#FF7F50; color:#ffffff; border: 2px ridge #800000; line-height: 1.5em; padding: 5px; border-radius: 15px;">Tulisan yang akan kamu tulis disini</textarea>Hasilnya :
<textarea name="code" rows="3" cols="50" style="background:#ADFF2F; color:#295F00; border:2px #295F00 dashed; line-height:1.5em; padding:5px;">Tulisan yang akan kamu tulis disini</textarea>Hasilnya :
<textarea name="code" rows="3" cols="50" style="background:#000000; color:#FFEFF9; border: 3px dotted #FF1000; line-height: 1.5em; padding: 5px;">Tulisan yang akan kamu tulis disini</textarea>Hasilnya :
<textarea name="code" rows="3" cols="50" style="background:#FFDEAD; color:#800000; border:3px double #8B4513; line-height:1.5em; padding:5px;">Tulisan yang akan kamu tulis disini</textarea>Hasilnya :
<textarea name="code" rows="3" cols="50" style="background:#EFF5FB; color:#000; border: 1px solid #ccc; border-left: 20px solid #800080; line-height: 1.5em; padding: 5px; border-radius: 7px;">Tulisan yang akan kamu tulis disini</textarea>Hasilnya :
Nah itu dia artikel tentang Variasi Text Area dengan CSS di Postingan. Semoga bermanfaat dan bisa membantu kalian memperindah blog. Semoga blognya semakin bagus dan rapi. Wassalam.
Dan sekarang kami akan kasih sedikit untuk Text Area dengan tombol Select All sehingga ketika kita mengklik dalam area Text tersebut maka tulisan di dalam itu akan ke select semua. Tinggal selanjutnya kita bisa copy paste ke lain bidang.
Sangat mudah khan. Kalian tinggal bubuhkan kode dibawah diantara tulisan yang akan di Text Area.
<div><form name="copy"><div align="center"><span><input onclick="javascript:this.form.txt.focus();this.form.txt.select();" value="Select All" type="button"> </span></div><p align="center"><textarea style="width: 100%; height: 80px; border-radius:0px;" name="txt" rows="6" wrap="VIRTUAL" cols="30">Tulisan kalian silakan dipajang disini.</textarea></p></form></div>Hasilnya :
Sekian teman-teman yang dapat kami sampaikan untuk artikel Variasi Text Area dengan Tombol Select All. Langsung dikerjakan dong ya. Siapa tahu bisa jadi menarik lagi blognya. Sekian dan terima kasih. Wassalam.
Label Postingan :
CSS
Terima kasih ya udah mempraktekkan tutorial blog di web alifacode.com dengan judul Variasi Text Area dengan CSS di Postingan . Semoga tutorial blog ini dapat bermanfaat. Salam Blogger.
