Menu Tab Comel Rotate (-5deg)

Assalammualaikum . Sebelum baca nie tolong klik SINI boleh ? :)
Ade seorang Princess bertanya kepada patik *ceyy

Macam mane nak buat tab menu joget2 ke kiri macam Arin punye tu :)
Macam ni haa ..

Arin try nak tolong .. setakat yang mampu lah hihi~
Sebelum tu, tutorial ni daripada blog [N comel]

Edit HTML-->Tick Expand Widget

Carik kode :

]]></b:skin>

Kalau tak jumpe, cer tengok sama ada awak tick expand widget template tak
Pastu kalau sudah jumpe kode tu, copy kode di bawah & paste kat ATAS ]]></b:skin> tadi

/* LIST #8 */

#list8 { }

#list8 ul { list-style:none;}

#list8 ul li { font-family:Georgia,serif,Times; font-size:18px;margin:1px; }

#list8 ul li a { display:block; width:80px; height:28px; background-color:#000000; border-right:10px solid #FFFFFF; padding-left:40px;

text-decoration:none; color:#FFFFFF; }

#list8 ul li a:hover { -moz-transform:rotate(-5deg); -moz-box-shadow:10px 10px 20px #000000;

-webkit-transform:rotate(-5deg); -webkit-box-shadow:10px 10px 20px #000000;

transform:rotate(-5deg); box-shadow:10px 10px 20px #000000; }

Awak cuma perlu mengubah suai font, warna, size font, background & lagii

Pastu, carik kode nie pulak :

</body>

Copy kode di bawah & paste di atas/sebelum  </body>

<div style='display:scroll; position:fixed; top:150px; left:-40px;'>

<div id='list8'>

<ul>

<li><a href='http://www.blogger.com/home'>Home</a></li>

<li><a href='LINK TAB KORANG'>Tajuk</a></li>

<li><a href='LINK TAB KORANG '>Tajuk</a></li>

<li><a href='LINK TAB KORANG'>Tajuk</a></li>

</ul>

</div>

</div>

P/s : LINK TAB KORANG contoh macam ni :

http://aduduvsalienpink.blogspot.com/p/tutorial-d.html

Tajuk tu contoh macam ni :

Tuto+Free

Kalau nak jelas, ni contoh kode Arin, kalau berkenan cuma ubah ape yang patut taw

 /* LIST #8 */

#list8 { }

#list8 ul { list-style:none;}

#list8 ul li { font-family:Trebuchet ms,Verdana; font-size:13px;margin:1px;center; }

#list8 ul li a { display:block; width:100px; height:30px; background-color:#00bfff; border-right: 8px solid #ffc0cb; #Trebuchet ms,Verdana; padding-left:40px;

text-decoration:none; color:#ffffff; }

#list8 ul li a:hover { background-color:#00bfff;-moz-transform:rotate(-5deg); -moz-box-shadow:10px 10px 20px #ffffff;

-webkit-transform:rotate(-5deg); -webkit-box-shadow:10px 10px 20px #58ACFA;

transform:rotate(-5deg); box-shadow:10px 10px 20px #Trebuchet ms,Verdana; }

 [Preview dulu ! Tak de error baru lah SAVE]
Tu je yang Arin nak share buat tab menu joget2 comel tu

Baii Assalammualaikum ~

---

THANKS FOR READING. DROP YOUR COMMENT PLEASE?

---