الهجان مستر وليد فريد
ادعية لوجة الله : عدد المساهمات : 4697 تاريخ الميلاد : 04/07/1975 تاريخ التسجيل : 21/09/2009 العمر : 49
| موضوع: قائمة جانبيه أحترافيه بخصائص CSS3 الجمعة أبريل 11 2014, 18:24 | |
| بسم الله الرحمن الرحيم والصلاة والسلام على خير خلق الله , سيدنا محمد عليه الصلاة واتم التسليم السلام عليكم ورحمة الله وبركاته . قائمة جانبيه أحترافيه بخصائص CSS3 - ستعجبك ! اليوم كالعادة درس جديد وإضافة جميلة ولا أروع , الأضافة من تعديلي وتطويري وقمت بدعمها بأفضل خصائص الـ CSS3 لمتابعين مدونتي فقط القائمة الجانبيه هذه تتميز بخصائص جدأَ رائعه ومن أفضل المميزات انها حصريه وخفيفه جداَ ومنظرها انيق لكل المدونات ولكل الأذواق بأذن الله . على العموم لن اطيل وللنبداء : نأخذ اولاَ صورة : مثال مباشر :
- أخبار تقنية
- أيقونات
- إضافات بلوجر
- إضافات للمتصفحات
- قائمة احترافيه
- مدونة حلول بلوجر
- حلول بلوجر
- حلول بلوجر
طريقة التركيب :
- ادخل مدونتك .
- ثم التخطيط .
- أضف اداة عبارة عن HTML.
- انسخ والصق هذا الكود بها مع تعديل ما سأذكره :
- الكود:
-
<div class='menu-by-7lolblogger'>
<ul>
<li>
<a dir="rtl" href="http://www.7lolblogger.com/">أخبار تقنية</a>
</li>
<li>
<a dir="rtl" href="http://www.7lolblogger.com/">أيقونات</a>
</li>
<li>
<a dir="rtl" href="http://www.7lolblogger.com/">إضافات بلوجر</a>
</li>
<li>
<a dir="rtl" href="http://www.7lolblogger.com/">إضافات للمتصفحات</a>
</li>
<li>
<a dir="rtl" href="http://www.7lolblogger.com/">قائمة احترافيه</a>
</li>
<li>
<a dir="rtl" href="http://www.7lolblogger.com/">مدونة حلول بلوجر</a>
</li>
<li>
<a dir="rtl" href="http://www.7lolblogger.com/">حلول بلوجر</a>
</li>
<li>
<a dir="rtl" href="http://www.7lolblogger.com/">حلول بلوجر</a>
</li>
</ul>
</div>
<style>
/* this is menu by : http://www.7lolblogger.com -- */
.menu-by-7lolblogger ul{width:300px;float:right;display:block;}.menu-by-7lolblogger li{margin: 0;text-align: right;list-style:none;width:48%;float:right;padding:0 2px 0 3px;}.menu-by-7lolblogger li a{position:relative;display:block;padding:.4em .4em .4em .4em;margin:.1em 0 .1em 2.5em;background:#F1F1F1;border:1px solid #DDD;border-radius:3px;color:#444;text-decoration:none;-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;-o-transition:all .3s ease-out;-ms-transition:all .3s ease-out;transition:all .3s ease-out;font:12px tahoma,arial;text-shadow:1px 1px rgba(255, 255, 255, 0.48);}.menu-by-7lolblogger li a:before{content:'#';position:absolute;left:-2.5em;top:50%;margin-top:-1em;background:#39C4FF;height:2em;width:2em;line-height:2em;text-align:center;font-weight:bold;}.menu-by-7lolblogger li a:after{position:absolute;content:'';border:.5em solid rgba(0, 0, 0, 0);left:-1em;top:50%;margin-top:-.5em;-webkit-transition:all .3s ease-out;-moz-transition:all .3s ease-out;-o-transition:all .3s ease-out;-ms-transition:all .3s ease-out;transition:all .3s ease-out;font:12px tahoma,arial;text-shadow:1px 1px rgba(255, 255, 255, 0.53);}.menu-by-7lolblogger li a:hover:after{left:-.5em;border-left-color:#39C4FF;}
</style> استبدله بالرابط . استبدله بأسم الرابط . | |
|