القائمة الرئيسية

الصفحات

اضافة التسميات مدونتك بشكل جديد لغة ال css

السلام عليكم ورحمه الله وبركاته
درس اليوم هو اضافة الاقسام فى مدونتك بشكل جديد مثل ما فى الصورة

اضافة التسميات مدونتك بشكل جديد لغة ال css

اضافة التسميات مدونتك بشكل جديد لغة ال css
هذا هو كود الاضافة غير ما فى الكود واى استفسار اضف تعليقاتك وسف اساعدك على مدونتك

<style type="text/css">
.Blogger-Widget-ahtrafy-up a {
display:block;
background:#eee;
border:1px solid #ccc;
margin: 0 0 20px 0;
height:65px;
width:290px;
overflow:hidden;
text-decoration:none;
font-family:inherit;
font-size:16px;
color:#000000;
text-shadow:0 1px 2px rgba(0, 0, 0, 0.75);
}
.Blogger-Widget-ahtrafy-up h5 {
color:#000000;
margin-top:0px;
height:65px;
text-align:center;
line-height:65px;
-webkit-transition: margin-top 0.2s linear;
}
.Blogger-Widget-ahtrafy-up a:hover h5{
margin-top:-90px;
}
.Blogger-Widget-ahtrafy-up div {
font-family:inherit;
font-size:17px;
color:#FFFFFF;
text-align:center;
padding:0px;
opacity: 0;

-webkit-transition: all 0.3s linear;
-webkit-transform: rotate(10deg);
}
.Blogger-Widget-ahtrafy-up a:hover div {
opacity: 1;
-webkit-transform: rotate(0deg);
}
.Blogger-Widget-ahtrafy-up a:nth-child(1) div { background: #EF7901; line-height:70px;}
.Blogger-Widget-ahtrafy-up a:nth-child(2) div { background: #98bf0d; line-height:70px;}
.Blogger-Widget-ahtrafy-up a:nth-child(3) div { background: #01b0ec; line-height:70px;}
.Blogger-Widget-ahtrafy a{ text-decoration:none; margin:10px; font-family:inherit; font-size:8px; font-weight:bold; color:#000000; overflow:hidden;-webkit-transition: All 1s ease;-moz-transition: All 1.5s ease;-o-transition: All 1.5s ease;-ms-transition: All 1.5s ease;transition: All 1.5s ease;
}
.Blogger-Widget-ahtrafy a:hover{ text-decoration:none; margin:75px; font-family:inherit; font-size:13px; font-weight:bold; color:#1fd4e9;-webkit-transition: All 1s ease;-moz-transition: All 1s ease;-o-transition: All 1s ease;-ms-transition: All 1s ease;transition: All 1s ease;
}
</style>




<section class="Blogger-Widget-ahtrafy-up">
<a href="http://bilokr.blogspot.com/">
<h5>مدونة بلوجر توب</h5>
<div>قريبا</div>
</a>
<a href="http://bilokr.blogspot.com/">
<h5>مدونة بلوجر توب</h5>
<div>قريبا</div>
</a>
<a href="http://bilokr.blogspot.com/">
<h5>مدونة بلوجر توب</h5>
<div>قريبا</div>
</a>

</section>
<section class="Blogger-Widget-ahtrafy">
<a href="http://bilokr.blogspot.com/">Blogger-Widget</a>
</section>
غير ما بالون الاحمر اسم التسميا 
غير ما بالون الازراق رابط التسميا

تعليقات

تعليقان (2)
إرسال تعليق

إرسال تعليق

يمنع نشر التعليقات ذات الروابط الدعائية أو تعليقات بإسلوب غير لائق أو التى تحتوى على معلومات شخصية كالبريد الإلكترونى
أعتذر عن الرد على طلبات التوزيع لضيق الوقت أو التبادل الإعلانى

لتصلك إشعارات ردود هذا الموضوع على البريد الإلكترونى أضف علامة بالمربع بجوار كلمة "إعلامى"

التنقل السريع
    -->