در طراحی سایت حرفه ای یکی از مهم ترین مواردی که طراحان باید به آن توجه کنند ، سازگاری پوسته سایت با تمامی مرور گر هاست.
مرورگر های رایج استاندارد هایی برای نمایش یک سایت دارند که در اکثر آنها مشترک است ، اما مرورگر های Internet Explorer) IE) دارای استاندارد های نسبتا متفاوتی هستند که در این مقاله راه کاری برای رفع این مشکل به شما نشان داده خواهد شد.
برای این کار، راه ساده ای وجود دارد و آن قرار دادن کامنت های شرطی است که می توانید توسط آن یک ورژن خاص و یا دسته ای از ورژن های مختلف IE را مورد هدف قرار دهید و برای آن استایل های خاصی را تعریف کنید.
این کار به شما اجازه میدهد فایل CSS خود را به چند عدد افزایش دهید و برای هر ورژن IE (یا دسته ای از ورژن های IE) از یک مورد خاص استفاده کنید.
در مواردی که نیازی به تغییر کلی فایل استال ( CSS ) نیست ، فقط نیاز است به تغییر مواردی ( id و class ) که دچار مشکل شده اند بپردازید و با استفاده کردن از همان نام برای id و class مورد نظر استایل جدیدی را در فایل Css جدید تعریف کنید.
مرورگر به طور خودکار مواردی که در فایل CSS مربوط به خودش وجود دارد را با موارد موجود در فایل CSS اصلی ، جایگزین می کند.
مواردی که در زیر آمده اند برای هدف قرار دادن انواع ورژن های IE مورد استفاده قرار می گیرد:
( این کد ها در قسمت head در کدهای HTML سایت و یا قالب وردپرس شما قرار می گیرد.)
هدف قرار دادن تمامی ورژن های IE بظور همزمان :
<!–[if IE]>
<link rel=”stylesheet” type=”text/css” href=”all-ie-versions.css” />
<![endif]–>
هدف قرار دادن ورژن های خاص IE ( به عنوان مثال IE 7 ) :
<!–[if IE 7]>
<link rel=”stylesheet” type=”text/css” href=”ie7.css”>
<![endif]–>
هدف قرار دادن ورژن خاص و پایین تر ( به عنوان مثال IE 7 ) :
<!–[if lte IE 7]>
<link rel=”stylesheet” type=”text/css” href=”ie7-and-down.css” />
<![endif]–>
هدف قرار دادن ورژن خاص و بالا تر ( به عنوان مثال IE 6 ) :
<!–[if gte IE 6]>
<link rel=”stylesheet” type=”text/css” href=”ie6-and-up.css” />
<![endif]–>