Membuat Thread Comment Bertingkat - kali ini saya akan membahas tentang bagaimana cara memebuat agar Thread comment betingkat sepeti gambar diatas. kode CSS-nya saya dapatkan dari DT:]. Cara pemasangannya pun sangat mudah.Berikut untuk cara memasang Thread Comment Bertingkat:
Letakkan kode berikut ini di atas kode
Semoga Bermanfaat.
Letakkan kode berikut ini di atas kode
]]></b:skin>
Kode yang berwarna hijau merupakan background pada Thread Comment dan untuk kode yang berwarna ungu adalah warna tulisan pada thread commnet, silahkan anda tentukan sendiri./* Efek thread-comment bertingkat hanya dengan CSS
* Level tingkatan dibuat dengan cara menuliskan margin-left dengan nilai yang berbeda
*/
.comments .thread-toggle {
margin-bottom:10px;
}
.comments .comment-thread.inline-thread .comment .comment-block {
margin-left:52px;
}
.comments .comment-thread.inline-thread .comment {
margin:0px 0px 5px 30%; /* Level 6+ */
background-color:#222;
border:1px solid #333;
padding:10px 15px;
color:#ccc;
}
.comment .comment-thread.inline-thread .comment:nth-child(6) {margin:0px 0px 5px 25%;} /* Level 6 */
.comment .comment-thread.inline-thread .comment:nth-child(5) {margin:0px 0px 5px 20%;} /* Level 5 */
.comment .comment-thread.inline-thread .comment:nth-child(4) {margin:0px 0px 5px 15%;} /* Level 4 */
.comment .comment-thread.inline-thread .comment:nth-child(3) {margin:0px 0px 5px 10%;} /* Level 3 */
.comment .comment-thread.inline-thread .comment:nth-child(2) {margin:0px 0px 5px 5%; } /* Level 2 */
.comment .comment-thread.inline-thread .comment:nth-child(1) {margin:0px 0px 5px 0%; } /* Level 1 */
Semoga Bermanfaat.
0 comments:
Post a Comment
Google/Blogger : Khusus yang punya Account Blogger.
Lainnya : Jika tidak punya account blogger namun punya alamat Blog atau Website.
Anonim : Jika tidak ingin mempublikasikan profile anda (tidak disarankan).