كود اضافه قائمه عموديه سى اس اس لبلوجر

اضافه جميله جدا لتحصل على قائمه عموديه شكل رائع وانيق فانها تعطى الاحترافيه لمدونتك 

الان صوره للاضافه

و الأن

نتابع الشرح لاضافة القائمة :
أولا نضيف كود css
نبحث عن : 

]]></b:skin>

 ونضع قبله هذا الكود:

#menu9 ul { list-style: none; margin: 0; padding: 0; } #menu9 img { border: none; } #menu9 { width: 200px; margin: 10px; } #menu9 li a { height: 32px; font-family: Verdana, Arial, Helvetica, sans-serif; margin: 0; font-size: 10pt; font-weight: bold; background: #FFF; height: 24px; text-decoration: none; } #menu9 li a:link, #menu9 li a:visited { color: #FFF; display: block; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUNj8TyTVCOWSuEzkOEvG78GOLVKWOmC2d68hj3PswUnK44MbQiEHBwqn1J8K_2wx6YRkMoXVjIEL35Hgzx6nw3XDrjiMvF-VA-Mkvkl8vNJRFo4KqEQRBu1VjqnespC-2GuOX0ery8Zs/s800/menu9.gif); padding: 8px 0 0 35px; } #menu9 li a:hover { color: #FFF; background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUNj8TyTVCOWSuEzkOEvG78GOLVKWOmC2d68hj3PswUnK44MbQiEHBwqn1J8K_2wx6YRkMoXVjIEL35Hgzx6nw3XDrjiMvF-VA-Mkvkl8vNJRFo4KqEQRBu1VjqnespC-2GuOX0ery8Zs/s800/menu9.gif) 0 -32px; padding: 8px 0 0 35px; } 

ثم احفظ القالب و توجه الى عناصر الصفحة و اختر اضافة اداة html و ضع هذا الكود :

<div id="menu9"> <ul> <li><a href="mdwanblog.blogspot.com">مدونه مدون css</a></li> <li><a href="mdwanblog.blogspot">عنوان2 </a></li> <li><a href="mdwanblog.blogspot">عنوان 3</a></li> <li><a href="mdwanblog.blogspot">Link 4</a></li> <li><a href="mdwanblog.blogspot">عنوان 4</a></li> </ul> </div> 

والان قم بتغيير ما باللون الاحمر الى العناوين الخاصه بك 

وشكرا من فضلك بضغطه زر واحده تشارك الفائده وتدعم المدونه (مدون)

فلا تبخل عن اصدقائك