add icon to link by CSS



بسم الله الرحمن الرحيم
السلام عليكم ورحمة الله وبركاته

اليوم رح ابدا بدرس بسيط

الفائده منه اضافة صور لللروابط بشكل تلقائي

Add icon to link by CSS

الطريقه بسيطه وهي

CODE: تحديد الكل
كود:
a[href^="http:"] {
background: url(link-img.gif) right no-repeat;
}
http نوع الرابط تستطيع تغييرها ب pdf swf mail zip rar

url(link-img.gif) رابط الايقونه

نقره لتكبير أو تصغير الصورة ونقرتين لعرض الصورة في صفحة مستقلة بحجمها الطبيعي

كود:
add 2 or more link 

a[href$='.zip'],  { 
    padding: 5px 20px 5px 0;
    background: transparent url(icon_archive.gif) no-repeat center right;
}

بمعنـى ..
أي رابط أو وسم (a) يبدأ بـ http: سيأخذ هذه الخصائص الموجودة

هنا أضفنا خلفية لا تتكرر وتكون ناحية اليمين


الرابط يجب ان يكون مستخدم التاق <a>

وشكرا لكم
انتظرو منا دروس اخرى

اي سؤال انا موجود