اداة روابط صديقة بشكل انيق وجذاب

بسم الله الرحمان الرحيم

اما بعد متتبعي ومتتبعات مدونة حاسوبي Astuce

في در س جديد حول كيفية اضافة اداة روابط صديقة بشكل انيق وجذاب

لن اطيل عليكم

لنشاهد التجربة

معاينة

تركيب الاضافة

ما عليك سوى اضافة اداة HTML/JavaScript

ولصق الكود التالي فيها

<style>.tabadolhassoubi a{
        display: block;color: #FFF;background: #ee632a;padding: 2px 21px;text-align: center;margin-right: 50px;margin-left: 50px;margin-top: 2px;border-radius: 10px;border-bottom: 4px solid #152836;text-decoration:none;transition: all .6s;font-family:tahoma;}
.tabadolhassoubi a:hover{    display: block;    color: #FFF;    background:#152836;    padding: 2px 21px;    text-align: center;    margin-right: 60px;    margin-left: 60px;    margin-top: 2px;    border-radius: 10px;    border-bottom: 4px solid #222222;transition: all .6s;}
</style>
<div class="tabadolhassoubi" style="color:#fff">
<a href="https://astuce-hassoubi.blogspot.com/" style="display:none">حاسوبي Astuce</a>
<a href="https://astuce-hassoubi.blogspot.com/">اضف موقعك هنا</a>
<a href="https://astuce-hassoubi.blogspot.com/">اضف موقعك هنا</a>
<a href="https://astuce-hassoubi.blogspot.com/">اضف موقعك هنا</a>
</div>

تحديد الكل

التنسيق

#ee632a:لون الخلفية
#FFF:لون النص
#152836:لون الحافة السفلي(border bottom)
#ee632a:لون الخلفية عند مرور الفارة
tahoma:نوع خط الكتابة(استبدله بنوع خط كتابة مدونتك)
#222222:لون الحافة السفلي عند مرور الفارة
كما يمكنك استبدال كلمة اضف موقعك هنا بنصك والرابط التالي

http://astuce-hassoubi.blogspot.com/

برابطك
انتهى الشرح والى درس آخر انشاء الله

• غرّد
• شارك
• شارك
• شارك
• شارك