شرح كيفية استخدام استايل لكل متصفح Css بسهولة تامة
فائدة الشرح
مع وجود متصفح فاشل مثل انترنت اكسبلورر اصبح الموضوع مؤلم للمصممين
و يعانى منه الكثير لان الكثير من المميزات لا تعمل عليه و تخرب شكل موقعك
سبب وضعى للشرح
بعد ان برمجت موقع كاملا و لله الحمد عملتله استايل كامل Css فقط
فوجئت انه قمة فى التناسق مع كل المتصفحات
Firefox
Safari
Chrome
Opera
و لكن تبقى الانترنت اكسبلورر كان شكله عليه وحش جدا
طبعا انا كنت ناوى انى اكتب كلمة يمنع تصفح الموقع بواسطة انترنت اكسبلورر من كرهى له
لكن ما كان ينفع لان بعض الناس رغم فشله لسه بيحبوه
و لكن لقيت حل بديل و هو عمل استايل خاص بيه
عندما يتصفح الزائر الموقع بواسطة متصفح انترنت اكسبلورر يظهر له بالشكل الخاص به
بمعنى انك يكون عندك استايل عادى Zero.Css
و استايل خاص بانترنت اكسبلورر مثلا IE8.Css
و هذا الكود
جميع الاكواد يتم وضعها بداخل وسم <Head>
و تسمى الاستايل باسم الملف الموجود فى الكود
فى حالة أردت استهداف انترنت اكسبلورر 6 تضع الكود التالى
- الكود:
-
[color=#000000][font=Courier New][color=#007700]<!--[if [/color][color=#0000bb]IE 6[/color][/font][font=Courier New][color=#007700]]>
<[/color][color=#0000bb]link rel[/color][color=#007700]=[/color][color=#dd0000]"stylesheet" [/color][color=#0000bb]type[/color][color=#007700]=[/color][color=#dd0000]"text/css" [/color][color=#0000bb]href[/color][color=#007700]=[/color][color=#dd0000]"ie6.css" [/color][/font][color=#007700][font=Courier New]/>
<![endif]--> [/font]
[/color][/color]
فى حالة أردت استهداف انترنت اكسبلورر 7 تضع الكود التالى
- الكود:
-
[color=#000000][font=Courier New][color=#007700]<!--[if [/color][color=#0000bb]IE 7[/color][/font][font=Courier New][color=#007700]]>
<[/color][color=#0000bb]link rel[/color][color=#007700]=[/color][color=#dd0000]"stylesheet" [/color][color=#0000bb]type[/color][color=#007700]=[/color][color=#dd0000]"text/css" [/color][color=#0000bb]href[/color][color=#007700]=[/color][color=#dd0000]"ie7.css"[/color][/font][color=#007700][font=Courier New]>
<![endif]--> [/font]
[/color][/color]
فى حالة أردت استهداف انترنت اكسبلورر 8 و ما فوقه تضع الكود التالى
- الكود:
-
[color=#000000][font=Courier New][color=#007700]<!--[if [/color][color=#0000bb]gte IE 8[/color][/font][font=Courier New][color=#007700]]>
<[/color][color=#0000bb]link rel[/color][color=#007700]=[/color][color=#dd0000]"stylesheet" [/color][color=#0000bb]type[/color][color=#007700]=[/color][color=#dd0000]"text/css" [/color][color=#0000bb]href[/color][color=#007700]=[/color][color=#dd0000]"ie8-and-up.css" [/color][/font][color=#007700][font=Courier New]/>
<![endif]--> [/font]
[/color][/color]
فى حالة اردت استهداف جميع اصدارات انترنت اكسبلورر
- الكود:
-
[color=#000000][font=Courier New][color=#007700]<!--[if [/color][color=#0000bb]IE[/color][/font][font=Courier New][color=#007700]]>
<[/color][color=#0000bb]link rel[/color][color=#007700]=[/color][color=#dd0000]"stylesheet" [/color][color=#0000bb]type[/color][color=#007700]=[/color][color=#dd0000]"text/css" [/color][color=#0000bb]href[/color][color=#007700]=[/color][color=#dd0000]"all-ie-only.css" [/color][/font][color=#007700][font=Courier New]/>
<![endif]--> [/font]
[/color][/color]
فى حالة أردت استهداف اى متصفح ماعادا إنترنت اكسبلورر
- الكود:
-
[color=#000000][font=Courier New][color=#007700]<!--[if ![/color][color=#0000bb]IE[/color][/font][font=Courier New][color=#007700]]><!-->
<[/color][color=#0000bb]link rel[/color][color=#007700]=[/color][color=#dd0000]"stylesheet" [/color][color=#0000bb]type[/color][color=#007700]=[/color][color=#dd0000]"text/css" [/color][color=#0000bb]href[/color][color=#007700]=[/color][color=#dd0000]"not-ie.css" [/color][/font][color=#007700][font=Courier New]/>
<!--<![endif]--> [/font]
[/color][/color]
معنى كلمة استهداف اى انك تستعمل الاستايل الخاص به عند تصفح الزائر به
بمعنى
استهداف انترنت اكسبلورر 7
معناه لو الزائر تصفح الموقع بانترنت اكسبلورر 7 راح يظهر معاه الاستايل اللى انت محدده
بجميع الاعدادات الموجودة فيه
أتمنى من الله يكون الشرح سهل و اى مساعدة لا تترددوا
و أعتذر لو فى أى خطأ فى الشرح
التسجيل
الرئيسية
جديد الموقع في تويتر
