CSS Kotak Pesan Untuk Postingan Blogger

CSS Kotak Pesan Untuk Postingan Blogger - Blitar4rt akan memberikan sebuah tutorial kepada sobat tentang CSS Kotak Pesan Untuk Postingan Blogger. CSS kotak untuk postingan ini adalah untuk menarik para pengunjung untuk melihatnya.

Kode CSS :

1. Buka akun Blogger.
2. Ke Edit HTML
3. Cari kode ini

]]></b:skin>

4. Pastekan kode berikut diatas kode tadi

.fave_css, .beranda_css, .ide_css, .penulis_css, .rss_css, .pena_css, .kunciedit_css, .peringatan_css, .komentar_css, .terkunci_css, .buku_css {
border: 1px solid
margin: 10px 0px;
padding:15px 10px 15px 50px;
background-repeat: no-repeat;
background-position: 10px center;
}
.fave_css {
color: #00529B;
background-color: #BDE5F8; -moz-border-radius-topleft: 18px; -moz-border-radius-topright: 18px; -moz-border-radius-bottomright: 18px; -moz-border-radius-bottomleft: 18px;
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjncMauniFHMJVsi7aA1h31lu4g3H9GFNx69yIsJI6XCG5s0Ijb61Lc2zYJ_oWCtOG3El0AVlcDI9WkuMrEc7anhSmGaCF_Dux4OBbz6Hl0gzuJth1Fq4pouEXwf0ep28nwozTCj0PPcLc/');
}
.beranda_css {
color: #4F8A10;
background-color: #DFF2BF; -moz-border-radius-topleft: 18px; -moz-border-radius-topright: 18px; -moz-border-radius-bottomright: 18px; -moz-border-radius-bottomleft: 18px;
background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhzIHqVSR6zmC2E6qEOVipDJARY9C8fgNW_HWXCwbeXvkScfyRnRTPx_rLRwPEVQYCDecb_QhvOVQsPnHw4x46vlzL0_Dhi-4U1WuXFwOzTp4CpUAdMv3PQNcXxgtuzhPxA8pylnoj8aH4/');
}
.ide_css {
color: #9F6000;
background-color: #FEEFB3; -moz-border-radius-topleft: 18px; -moz-border-radius-topright: 18px; -moz-border-radius-bottomright: 18px; -moz-border-radius-bottomleft: 18px;
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEieAOYa62mkplq_KwB5RlYVdZwukzvS_eky2l6KP6pelRd1EbaKYdU-rqHgpPd47JuNoCNwLgWdpKvEF1-L4wB1R0gaWXke2SNUyNRpAtA7UdZKcO3nG7NfEK8y2IGiC55l9oEB0FqOm4o/');
}
.penulis_css {
color: #2E2D2D;
background-color: #A1C2C7; -moz-border-radius-topleft: 18px; -moz-border-radius-topright: 18px; -moz-border-radius-bottomright: 18px; -moz-border-radius-bottomleft: 18px;
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjDL5r77fR_ZX9oeWPoGvXBVyJfQ2IRlTHDqG0_goLDn9I5QQld239kja948_qkkdxsddLwxx9bgoBDOjZ6aePIGTOa3xMBNYICXJGCqcH_1ioCVta_UnV5TnUB-B6UdnNRn2RL3BznR9o/');
}
.rss_css {
color: #4F8A10;
background-color: #DFF2BF; -moz-border-radius-topleft: 18px; -moz-border-radius-topright: 18px; -moz-border-radius-bottomright: 18px; -moz-border-radius-bottomleft: 18px;
background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhEtt_UdGXd6wiHhFHTKdbXKHh0XuWtt5Wp1M7HF0IqlAF9ZKXJX5UdoS7IRcXy16CAC6V04mIl_Lblt-K4WwcpPwL-FMuukoqY4Q-5L4E0uF7jcm4LpJPmKkMR0IB0FRFYP4mOK8njmX0/');
}
.pena_css {
color: #2E2D2D;
background-color: #C8E0C8; -moz-border-radius-topleft: 18px; -moz-border-radius-topright: 18px; -moz-border-radius-bottomright: 18px; -moz-border-radius-bottomleft: 18px;
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhn_x3vOpkcezgOTvDqKiTLZ56xUSmd5AVeOwylHefaEI2H69a3TzBENGi7cVD0S4V1lvATSB-Af4Kn7BHSfbhE2Zlv6-YLpv9GAxa5xTzXZeEelGoZA8wSsvROAffaO5IehMAbgFgRDKw/');
}
.kunciedit_css {
color: #554529;
background-color: #F1C983; -moz-border-radius-topleft: 18px; -moz-border-radius-topright: 18px; -moz-border-radius-bottomright: 18px; -moz-border-radius-bottomleft: 18px;
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxWpzUDW2F9j2EnwFbBb-qNToOADexqpEchm8REvqlGBXJJbYhvuIYxrdIIhiUokCDvGPpmKrRFVI6pLRybP481-BK2jwICrK66HkrPEZNk0EGed1N0KG_phRf7cypiQ65t3kcsFhl858/');
}
.peringatan_css {
color: #2E2D2D;
background-color: #D25F66; -moz-border-radius-topleft: 18px; -moz-border-radius-topright: 18px; -moz-border-radius-bottomright: 18px; -moz-border-radius-bottomleft: 18px;
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0WJnrS7zQ94ZADcgXFtq-c6-fJeUWSMWE8jng7waG-qljdEoDQe2kYTV5OzErxJeVIjXRomPal-JJoVtyBjMjVFqhs6ljnhjw-H7gCKEvJgj6o-rV3tsVtgQq9YICUvLesVmPwPDV2pY/');
}
.komentar_css {
color: #2E2D2D;
background-color: #A6C8D2; -moz-border-radius-topleft: 18px; -moz-border-radius-topright: 18px; -moz-border-radius-bottomright: 18px; -moz-border-radius-bottomleft: 18px;
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijmc0ooQM5phET3iku0Ti0Lrt51q17Aol5E6sCIF8P6_k6RSDk1sb7aHk0kSiOJOccULhlG94W0-pzxkbvcC1mwu3DH7uvWxozdkT_cuPnLz9JUDX4x0ofA7p1t3QOsR1Zgm7nbd-mSP8/');
}
.terkunci_css {
color: #2E2D2D;
background-color: #FFBABA; -moz-border-radius-topleft: 18px; -moz-border-radius-topright: 18px; -moz-border-radius-bottomright: 18px; -moz-border-radius-bottomleft: 18px;
background-image: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh5eXeXCxghQHVSQpIavEIhLURzitsThzTyKCa66NRcwqpK0o83WjkJd9HmiQ42HGf7o4S__pIgif8NV3RWtPdgWGWSR4OlKJh6IC8HSDZ4_Q5BJD6jX1ml9ovRsIVmBKwdRzWPELhRKVo/');
}
.buku_css {
color: #4F8A10;
background-color: #DFF2BF; -moz-border-radius-topleft: 18px; -moz-border-radius-topright: 18px; -moz-border-radius-bottomright: 18px; -moz-border-radius-bottomleft: 18px;
background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgs5UsOyI2w4AOS4oe4UXWecQP3MRuk4E-e7T_gIac5ZO4bv0AIY34COSdLYwN3TSskHYGoAIO71yad2_ofDr5C5zQADrBXiX373PfAB__WjVzIj4FWXMxYCF_GeILP8tq6CcfCm61DbhQ/');
}

Kode HTML:

Kode HTML Kotak Pesan :

<div class=”fave_css “>

Tempatkan teks Anda disini

</div>

<div class=”beranda_css “>

Tempatkan teks Anda disini

</div>

<div class=”ide_css “>

Tempatkan teks Anda disini

</div>

<div class=”penulis_css “>

Tempatkan teks Anda disini

</div>

<div class=”rss_css “>

Tempatkan teks Anda disini

</div>

<div class=”pena_css “>

Tempatkan teks Anda disini

</div>

<div class=”kunciedit_css “>

Tempatkan teks Anda disini

</div>

<div class=”peringatan_css “>

Tempatkan teks Anda disini

</div>

<div class=”komentar_css “>

Tempatkan teks Anda disini

</div>

<div class=”terkunci_css “>

Tempatkan teks Anda disini

</div>

<div class=”buku_css “>

Tempatkan teks Anda disini

</div>