Tuesday, 10 January 2012

TUTORIAL : BORDER POST TITLE & TITLE SIDEBAR SENGET

Assalamualaikum..

kali ni cik N nak tunjuk cara buat border senget untuk post title ..
ikut sini~ hoyeeeh.. camni haa..



1) pergi ke Dashboard > Design > Edit HTML > Tick Expand Widget Templates.


2) cari code ini untuk post title :
h3.post-title, .comments h4 { 
atau

h3.post-title {
* cari code ini untuk title sidebar :
/* Headings
----------------------------------------------- */
h2 {

kalau tak jumpe jugak korang delete satu satu huruf tu eh.. mesti ade lah..  

3) bawah code kat atas tu korang akan jumpa code macam bawah ni.. ish.. seakan akan macam ni bukan sebijik macam ni ok..

margin : 0 ;
padding : 0 ;
font-size: 100% ;
font weight: bold ;

4) korang gantikan dengan code ini:


padding:4px;

margin:1.5em 0 .75em; font-size: 14px;

background: #FFFFFF;

border-top: 3px dotted #000000;

border-bottom: 3px dotted #000000;

border-left: 3px solid #000000;

border-right: 3px solid #000000;
-moz-border-radius: 25px 10px / 10px 25px;
border-radius: 25px 10px / 10px 25px;
text-align:center;
}
.post-title:hover {
-moz-border-radius: 1em 4em 1em 4em;               
border-radius: 1em 4em 1em 4em;                 
-moz-transform: rotate(-2deg);
-webkit-transform: rotate(-2deg);
}


kelabu: Your font size.
merah : Warna background.
oren: Ketebalan border.
hijau: Boleh ditukarken kepada solid / dashed / dotted.
turqoise: Warna border. sini..
biru: Jenis-jenis border. Kalau nak tukar, sini... 
ungu: Kedudukan text. Tukar ke left right center

pinksenget border korang. Yang diberi tu senget ke kanan, kalau nak ke kiri tukarkan jadi 2. Nombor pun boleh tukar, makin besar nombor, makin senget la border korang, sampai nombor 5 je ok..

dah jadi??? preview dan save ukey!!
Related Posts Plugin for WordPress, Blogger...