قائمة عمودية للأقسام الأساسية بتقنية css3

مرحباً بكم من جديد في اضافات بلوجر

مرحباً بكم زوار مدونتي اتمنى منكم التفاعل وشكراً لكل شخص يدعم المدونة 

ويرى ان جهودنا ليست عادية 

الاضافة مميزة فعلاً لأقبال الكثير من المدونين عليها لكن لم يجدها سوى القليل

ونحن استفردناها لكم 

مع سهولة التركيب كما عودناكم بدون التعديل على الاكواد والامور التي تزعجكم 

صورة الاضافة

طريقة التركيب


1- الذهاب الى لوحة التحكم
2- انقر على تخطيط
3- اختار اضافة اداة
4- اختر اداة الـ html/javascript


تم التعديل وفقاً لرد العضو 

تم التحديث بتاريخ 2015/2/24





الكواد

<style>#vbar ul{list-style-type:none;list-style: none;margin:0px;padding:0px 8px 6px 8px;border-top:1px solid #d6d6d6;}#vbar ul li{background:#f8f7f7;padding:10px 10px;margin-right: 6px;color:#666;box-shadow:inset 0 0 1px #fff;border-bottom:1px solid #d6d6d6;border-left:1px solid #d6d6d6;border-right:1px solid #d6d6d6;margin:0;-webkit-transition: All 0.5s ease;-moz-transition: All 0.5s ease;-o-transition: All 0.5s ease;-ms-transition: All 0.5s ease;transition: All 0.5s ease;}#vbar ul li:hover{background:#efefef;box-shadow:inset 0 0 2px #ddd;-webkit-transition: All 0.5s ease;-moz-transition: All 0.5s ease;-o-transition: All 0.5s ease;-ms-transition: All 0.5s ease;transition: All 0.5s ease;}#vbar a{text-decoration:none;color:#2D2D2D;}#vbar a:hover{text-decoration:none;color:#037DFF;}#vbar h2{margin:8px;color:#666;border:1px solid #d6d6d6;background: -moz-linear-gradient(top, #f8f8f8, #eaeaea);background: -webkit-gradient(linear top, #f8f8f8, #eaeaea);background: -ms-linear-gradient(top, #f8f8f8, #eaeaea);background: -o-linear-gradient(top, #f8f8f8, #eaeaea);padding:8px;font-family:'alweeam', 'Droid Arabic Kufi', Arial,Helvetica,Sans-serif;font-size:12px;line-height:24px;font-weight:bold;-webkit-transition: All 1s ease;-moz-transition: All 1s ease;-o-transition: All 1s ease;-ms-transition: All 1s ease;transition: All 1s ease;}#vbar ul li a {color:#000;font-size:12px;font-family: Tahoma, Arial;font-weight: normal;text-decoration: none;-webkit-transition: All 0.5s ease;-moz-transition: All 0.5s ease;-o-transition: All 0.5s ease;-ms-transition: All 0.5s ease;transition: All 0.5s ease;}#vbar .widget {   border: 1px solid #ddd;  background-color: #fff;  margin-bottom: 10px;  box-shadow:inset 0 0 4px #eee; }.menu a img {float:right;padding-left:10px;}</style>    <div id="vbar"><ul><li class="menu"><a href="http://add-b.blogspot.com/"><img src="http://www.yazansat.com/images/home.png" />الرئيسية</a></li><li class="menu"><a href="http://add-b.blogspot.com/2013/08/add-comment-facebook.html"><img src="http://www.sanachildren.org/templates/ca_faith_j25/images/icons/icon-sana-blue.png" />من نحن</a></li><li forclass="menu"><a href="http://add-b.blogspot.com/2013/08/You-Might-Also-Like.html"><img src="https://www.treesforlife.org/sites/all/themes/basic/treesforlife/images/myspace.png" />سجل الزوار</a></li><li class="menu"><a href="http://add-b.blogspot.com/search/label/%D8%A7%D9%84%D8%B1%D8%A8%D8%AD"><img src="http://im35.gulfup.com/V9qDM.png" />الربح</a></li><li class="menu"><a href="http://add-b.blogspot.com/"><img src="http://mixnet.com/images/mixnet-message-contact.png" />اتصل بنا</a></li></ul></div>

قم بتعديل على رابط مدونتي  

اما الاخر فهو كما واضح بالعربي (الرئيسية) الـــخ ... غيرهم بما يناسيوك 

واي استفسار نحن بالخدمة 

دمتم بود تابع كل جديدنا عبر بلوجر