Sarp
مدیر بازنشسته
همهی طراحان و کاربران وب تا کنون نام مرورگرهای محبوب کمپانی گوگل یعنی Chrome و همچنین Apple Safari را شنیدهاند. مرورگرهایی که جزو مرورگرهای پرطرفدار دستهبندی میشوند و البته همانطور که میدانید مرورگر گوگل کروم توانست پس از مدت کمی از عرضهاش در ردهی سوم مرورگرهای محبوب دنیا قرار بگیرد. اما این مرورگرها با اینکه یک مرورگر کامل و تقریبا بینقص لوده و قادرند تمامی صفحات استاندارد را به درستی نمایش دهند، اما شاید بعضی مواقع در طراحی یک صفحه با این مرورگرها به مشکل بخورید.
گاهی اوقات ممکن است یک صفحهی وب در همهی مرورگرها به درستی نمایش داده شود اما شما آن را در مرورگر Chrome یا Safari به گونهای دیگر مشاهده کنید که میتواند کل صفحهی طراحی شده توسط شما را زیر سوال ببرد. البته این مشکل بسیار کم پیش میآید اما در هر صورت ممکن است شما نیز نمونهای از آنرا تجربه کنید. در این مطلب قصد داریم دستورات اختصاصی این مرورگرها را به شما معرفی کنیم.
اگر شما میخواهید یک فایل سبکدهی (Stylesheet) کاملا متفاوت را به مرورگر خود نسبت دهید میتوانید با استفاده از دستور زیر این کار را انجام دهید. در دستور زیر شما در قسمت نوع متالینک خود به جای text/css عبارت text/chrome یا text/safari را وارد میکنید که باعث میشود مرورگرهای دیگر این فایل را فراخوانی نکنند. این روش در مرورگرهای فایرفاکس 3.6 و 4 ، اوپرا 10 و 11 و مرورگر Internet Explorer نسخههای 6، 7 و 8 تست شده است و این مرورگرها فایل سبکدهی مربوط به این کد را به هیچ عنوان بارگذاری نمیکنند.
و البته این روش برای مرورگر Safari نیز به درستی کار میکند:
اما ممکن است شما نخواهید یک فایل سبکدهی جداگانه را به مرورگر خود نسبت دهید و میخواهید در فایل سبکدهی اصلی خود این دستورات را به مرورگر نسبت دهید. برای این کار کافیاست در فایل استایل خود هرجایی که میخواهید کدی را به مرورگرهای گوگل کروم و سافاری اختصاص دهید دستورات خود را در تکه کد زیر وارد کنید:
به عنوان مثال:
همانطور که میتوان حدس زد عنصر div در تکه کد بالا فقط برای مرورگرهای گوگل کروم و سافاری از بالا 90 پیکسل فاصله میگیرد و در مرورگرهای دیگر این عمل اتفاق نخواهد افتاد.
منبع
گاهی اوقات ممکن است یک صفحهی وب در همهی مرورگرها به درستی نمایش داده شود اما شما آن را در مرورگر Chrome یا Safari به گونهای دیگر مشاهده کنید که میتواند کل صفحهی طراحی شده توسط شما را زیر سوال ببرد. البته این مشکل بسیار کم پیش میآید اما در هر صورت ممکن است شما نیز نمونهای از آنرا تجربه کنید. در این مطلب قصد داریم دستورات اختصاصی این مرورگرها را به شما معرفی کنیم.
اگر شما میخواهید یک فایل سبکدهی (Stylesheet) کاملا متفاوت را به مرورگر خود نسبت دهید میتوانید با استفاده از دستور زیر این کار را انجام دهید. در دستور زیر شما در قسمت نوع متالینک خود به جای text/css عبارت text/chrome یا text/safari را وارد میکنید که باعث میشود مرورگرهای دیگر این فایل را فراخوانی نکنند. این روش در مرورگرهای فایرفاکس 3.6 و 4 ، اوپرا 10 و 11 و مرورگر Internet Explorer نسخههای 6، 7 و 8 تست شده است و این مرورگرها فایل سبکدهی مربوط به این کد را به هیچ عنوان بارگذاری نمیکنند.
کد:
[LEFT]<link rel="stylesheet" href="/style.css" type="text/chrome" /> [/LEFT]
کد:
[LEFT] <link rel="stylesheet" href="/style.css" type="text/safari" /> [/LEFT]
کد:
@media screen and (-webkit-min-device-pixel-ratio:0) {
...
}
کد:
@media screen and (-webkit-min-device-pixel-ratio:0) {
#div {
Margin-top: 90px;
}
}
منبع