pregnancy

جديد ايقونات مواقع التواصل الاجتماعي 2015 روعة







» الصلاة و السلام على أشرف المرسليـن ...~
» الحمد لله وحده نحمده و نشكره و نستعينه و نستغفره و نعود بالله من شرور أنفسنا و من سيئاتأعمالنا ...~
» من يهده الله فلا مظل له و من يظلل فلن تجد له ولياً مرشدا ...~
» و أشهد ألا إلاه إلا الله وحده لا شريك له و أن محمداً عبده و رسوله صلى الله عليه و سلم ...~
» وعلى آله و صحبه أجمعين و من تبعهم بإحسان إلى يوم الدين ...~
» ربنا لا علم لنا إلا ما علمتنا إنك أنت العليم الخبير ...~
» ربنا لا فهم لنا إلا ما فهمتنا إنك أنت الجواد الكريم...~
» ربي اشرح لي صدري و يسر لي أمري و احلل عقدة من لساني يفقهوا قولي ...~

» أما بعد ...~

» فإن أصدق الحديث كتاب الله تعالى و خير الهدي هديُ سيدنا محمد صلى الله عليه و سلم ...~
» و شر الأمور محدثاتها و كل محدثة بدعة و كل بدعة ضلالة و كل ضلالة في النار ...~
» فاللهم أجرنا و قنا عذابها برحمتك يا أرحم الراحمين ...~




اليوم اقدم كم كود ايقونات تواصل الاجتماعي عملته قبل فتره لكن لم يسن لي الوقت لطرحه لكم

اليوم اضعه بين ايديكم

الكود

كود:
<div class="Social">
<a target="_blank" href="رابط حسابك">
<div class="facebook">
<img src="https://cdn1.iconfinder.com/data/icons/logotypes/32/square-facebook-48.png">
</div></a>
<a target="_blank" href="رابط حسابك">
<div class="google"><img src="https://cdn1.iconfinder.com/data/icons/logotypes/32/square-google-plus-48.png">
</div></a>
<a target="_blank" href="رابط حسابك">
<div class="twitter"><img src="https://cdn1.iconfinder.com/data/icons/logotypes/32/square-twitter-48.png">
</div></a>
</div>


أكواد CSS


كود:
.Social{
top:200px;
width:50px;
height:200px;
right:0;
position:fixed
}

.Social:hover{
width:120px;
box-shadow:0 0 0    #000  
top:200px;height:200px;
right:0;
position:fixed
}

.facebook{
background-color:   #3b5998  
width:50px;
transition:width .5s ease .15s;
top:200px;
right:0;
position:fixed
}

.facebook:hover{
background-color:   #3b5998  
top:200px;
right:0;
width:120px;
position:fixed;
box-shadow:1px 1px 8px #000
}


.google{
background-color:   #de2f2f  
width:50px;
transition:width .5s ease .15s;
top:250px;
right:0;
position:fixed
}

.google:hover{
background-color:   #de2f2f  
top:250px;
right:0;
width:120px;
position:fixed;
box-shadow:1px 1px 8px #000
}

.twitter{
background-color:   #55acee  
width:50px;
transition:width .5s ease .15s;
top:300px;
right:0;
position:fixed
}

.twitter:hover{
background-color:   #55acee  
top:300px;
right:0;
width:120px;
position:fixed;
box-shadow:1px 1px 8px #000
}
هذا مثل مباشر لكود

[ أضغط هنا ]






» وبكذا انتهى موضوعي لليوم ...~

» كل ما اريد هو دعوة صادقه برحمه للوالده ...~

» تقبلو تحياتي انا اخوكم في الله ...~



شكرا لتعليقك