Selain itu text box juga digunakan sebagai bacground untuk sebuat link/ url penghubung antara satu posting ke posting yang lain.
Ada beberapa bentuk dari kotak text yang akan saya bagikan ke sobat kali ini, mari kita simak beberapa bentuk dari kotak text lengkap dengan kode html
Cara membuat kotak text / background untuk tulisan di artikel blog [wordpress & blogspot]:
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>
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 script bentuk 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>
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>
<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>
<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>
<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>
<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>
<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>
<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>
Demikian bentuk bentuk kotak text yang dapat saya bagikan jika ada bentu yang lebih baru yang sobat tahu silahkan disharing kepada kawan semua.Kode script html:
<div style="background-color: #f3f3f3; padding: 10px; text-align: left;">
masukan text disini
</div>
0 comments