Kod Kotak Teks

CARA BUAT KOTAK TEKS  DAN BACKGROUND PADA ENTRI BLOG

1. Masuk / Login ke akaun Blogger anda.

2. Buat entri baru.

3. Pilih bahagian HTML, disebelah atas bahagian kiri ya.

4. Pilih kod yang anda inginkan seperti dibawah.

5. Setelah selesai, pilih Compose.

6. Kemudian, COPY tulisan yang telah anda tulis.

7. PASTE ke dalam kotak tersebut. 

1. Kotak Jenis Berbingkai

masukan tulisan anda disini

<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

2. Kotak Jenis Dotted

masukan tulisan anda disini (Dotted)

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

3. Kotak Jenis Dashed

masukan tulisan anda disini (Dashed)

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

4. Kotak Jenis Solid

masukan tulisan anda disini (Solid)

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

5. Kotak Jenis Groove

masukan tulisan anda disini (Groove)

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

6. Kotak Jenis Inset

masukan tulisan anda disini (Inset)

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

7. Kotak Jenis Ridge

masukan tulisan anda disini (Ridge)

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

8. Kotak Jenis Outset

masukan tulisan anda disini (outset)

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

9. Jenis Tiada Kotak

masukan text disini

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

Bagaimana? Mudahkan tutorial kali ini? Insya-Allah, semoga bermanfaat. Sekian