15 October 2011

Tutorial | Cantikkan Comment Box part 2 |



Contoh macam kat bawah ni


1) Tekan CTRL + F dan cari kod ini
/* Comments
2) Dah jumpa sila scroll ke bawah dan korang akan jumpa kod macam ni
#comments h4 {
margin:1em 0;
font-weight: bold;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.2em;
color: $sidebarcolor;
}
#comments-block {
margin:1em 0 1.5em;
line-height:1.6em;
}
#comments-block .comment-author {
margin:.5em 0;
}
#comments-block .comment-body {
margin:.25em 0 0;
}
#comments-block .comment-footer {
margin:-.25em 0 2em;
line-height: 1.4em;
text-transform:uppercase;
letter-spacing:.1em;
}
#comments-block .comment-body p {
margin:0 0 .75em;
}
.deleted-comment {
font-style:italic;
color:gray;
}
3) Delete kod tadi dan gantikan dengan kod di bawah ini
#comments h4 {
margin: 1em 3em;
font-weight: bold;
line-height: 1.4em;
}
#comments-block {
margin-left:1.5em;
line-height:1.6em;
background: #ffffff;
color: black;
padding: 1em;
border:0px solid #ffffff;
}
#comments-block .comment-author {margin:.5em 0;}
#comments-block .comment-body {margin:.25em 0 0; background: #ffffff;}
#comments-block .comment-footer {
margin:-.25em 0 2em;
line-height: 1.4em;
letter-spacing:.1em;
}
#comments-block .comment-body p {
margin:0 0 .75em;
padding: 20px 10px 10px 10px;
background: #f3a64c url(http://i1089.photobucket.com/albums/i341/elyana1/pink-2.jpg) repeat top left;
-moz-border-radius: 25px 25px / 25px 25px;
border-radius: 5px 5px / 5px 5px;
Border: 2px solid  #FAAFBE;
}
.deleted-comment {
  font-style:italic;
  color:gray;
}
4) Kod merah adalah URL BACKGROUND dan gantikan dengan background korang

5) Kod biru adalah warna border 

6) Siap boleh save


Terima kasih sudi baca. Like kalau suka

4 suka ayam goreng:

Chuu Muqhlis said...

tgk la belog ni comel ^^

El Yana said...

tq..ngeee

Rara. said...

amboih2,comel aih blog ni. macam tuan dia :)

El Yana said...

@Rara : blog awk pn comel gak

>
 
copyright by > Cikelyana