آگهی
article

تنظیمات CSS مخصوص مرورگر اینترنت اکسپلورر

css-internet-explorer-if

به عنوان کاربر دنیای وب اغلب با مرورگرهای متفاوت به سایت ها و وبلاگ های مختلف سر می زنیم و بیش از هر چیز رسیدن به محتوای مورد نظر برایمان اهمیت دارد و کمتر به ظاهر سایت و وبلاگی که در حال بازدید از آن هستیم و اشکالات و ایرادات آن توجه داریم، فارغ از مسائل فنی مطلب را می خوانیم و در آخر هم صفحه را بسته و وبگاه را ترک می کنیم، اما در پشت صحنه کار برای مدیران حرفه ای وبسایت ها و وبلاگ ها داشتن قالبی استاندارد و اینکه همه کاربرانشان صرف نظر از مرورگری که استفاده می کنند بتوانند نتیجه تلاش آنها را به شکل واحدی مشاهده کنند اهمیت زیادی دارد، جالب است اگر بدانیم که مرورگرهای وب اگرچه از قوانین تقریبا مشترکی پیروی می کنند اما هر کدام در نحوه تفسیر این قوانین ساز خودشان را می نوازند و درست اینجاست که مشکل برای طراحان وب شروع می شود، هرچند در نسخه های به روزتر سازگاری مرورگرها و یکسان سازی آنها بیشتر و بیشتر می شود اما دردسر همیشگی طراحان یعنی مرورگر اینترنت اکسپلورر (Internet Explorer) در این بین سرآمد مرورگرهای غیر استاندارد و مشکل ساز است که به همین دلیل شرکت مایکروسافت (خالق و مالک این مرورگر) که گویا از شاهکار خود اطلاع داشته برای تنظیم استایل CSS مخصوص این مرورگر در نسخه های مختلف راهکارها و قابلیت هایی تحت عنوان پیام های شرطی (Conditional Comments) و هک های ویژه پیشنهاد داده است که به عنوان طراح وب بد نیست از آنها آگاهی داشته باشیم.

چرا باید تنظیمات مخصوص مرورگر اینترنت اکسپلورر را اعمال کنیم؟


شاید برایمان جای سوال باشد که چرا باید تنظیمات مخصوص مرورگر اینترنت اکسپلورر را در صفحه وب خود داشته باشیم؟
در پاسخ باید گفت که البته این کار همیشه هم ضروری نیست، اگر صفحه وب به خوبی در نسخه های مختلف مرورگر اینترنت اکسپلورر و سایر مرورگرها نمایش داده می شود و تمام عناصر آنطور که انتظار داریم سر جای خودشان هستند دیگر نیازی نیست تنظیمات جداگانه ای را اعمال کنیم، چرا که هدف از تنظیمات CSS مخصوص، در نظر گرفتن استایل سفارشی و سازگار کردن صفحه وب از لحاظ نمایش ظاهری و درست عمل کردن امکانات مبتنی بر CSS در نسخه های مختلف مرورگرها به شکل یکسان است، بر این اساس صرفا در حالتی که صفحه وب در برخی نسخه های مرورگرها آنطور که مد نظر داریم نمایش داده نشود و ایراداتی مانند جابجایی یا مخفی شدن عناصر مشاهده شود، راه حل متداول می تواند در نظر گرفتن استایل CSS مخصوص باشد.

برای تنظیم ویژگی های CSS خاص اکسپلورر، چه روش هایی وجود دارد؟


معمول ترین و متداول ترین روش تنظیم ویژگی های CSS خاص مرورگر اینترنت اکسپلورر استفاده از پیام های شرطی یا (Conditional Comments) است که در ادامه آموزش حاضر به طور مفصل در این رابطه خواهیم گفت، شیوه های دیگری تحت عنوان هک یا CSS Hack نیز وجود دارند که در واقع به معنی استفاده از علائم مخصوص در هنگام تعریف خاصیت های CSS است که صرفا توسط نسخه های خاصی از مرورگر اینترنت اکسپلورر پردازش می شود، این علائم برای سایر مرورگرها تاثیرگذار نیست و مفهوم خاصی را القاء نمی کند.

کدنویسی استایل CSS مخصوص مرورگر اینترنت اکسپلورر


برای کدنویسی استایل CSS مخصوص مرورگر اینترنت اکسپلورر ابتدا باید سایت، وبلاگ یا قالب طراحی شده را با برنامه هایی نظیر IETester که از آدرس www.my-debugbar.com قابل دریافت و نصب است بررسی کنیم، اگر موردی به نظرمان دچار ناسازگاری و ایراد بود سعی کنیم کلاس یا آی دی CSS مربوط به آن قسمت را پیدا کرده و پس از اعمال تغییرات در راستای سازگاری مد نظرمان نتیجه را دوباره امتحان کنیم و این روند را تا جایی که مشکل حل شود ادامه دهیم، به طور مثال ممکن است به فرض نمایش خاصیت border در یک نسخه از مرورگر دچار اشکال باشد و نیاز به اعمال استایل اختصاصی برای آن نسخه ضرورت داشته باشد در این صورت اگر استایل اصلی به این شکل باشد:
<style type="text/css">
.compatible {
    display: inline-block;
    width: 600px;
    height: 800px;
    border: 1px solid #000000;
    line-height: 22px;
}
</style>
در استایل اختصاصی کافی است صرفا قسمت مربوط به خاصیت border را بر اساس نیازمان تغییر دهیم:
<style type="text/css">
.compatible {
    border: 2px solid #000000;
}
</style>
حال تکه کد اختصاصی مربوط به هر نسخه از اکسپلورر که با آن کد مشکل در آن نسخه مخصوص حل می شود را ترجیحا درون یک فایل CSS دیگر کپی می کنیم (معمولا تنها کافی است کلاس یا آی دی مورد نظر را به همراه ویژگی هایی که خاص مرورگر اکسپلور است کپی کنیم) تا آن را با دستوراتی که در ادامه خواهیم گفت پس از فایل CSS اصلی در صفحه به طور جداگانه وارد نمائیم.
نکته 1: قبل از اعمال هر نوع تغییراتی باید از استایل CSS اصلی پشتیبان بگیریم، دقت کنیم که فایل CSS اصلی قالب، مبنای کار ما است و تا حد امکان هر قالب باید از یک فایل استایل واحد پیروی کند، به عبارتی در نظر گرفتن استایل اختصاصی باید در حداقل موارد و ترجیحا در فایل های مجزا بوده و پس از فایل CSS اصلی در صفحه درج شود تا قانون اولویت بندی خاصیت های مشابه در CSS به درستی رعایت شود.
نکته 2: عبارت IE مخفف Internet Explorer است.

پیام های شرطی در مرورگر اینترنت اکسپلورر


نخستین روش اعمال تنظیمات مخصوص مرورگر اکسپلورر استفاده از پیام های شرطی (Conditional Comments) است که در اکسپلورر با علائم خاصی با فرمت نمونه زیر تعریف می شود:
<!--[if IE]>
آدرس فایل استایل مخصوص مرورگر اینترنت اکسپلورر
<![endif]-->
توضیح:
- حالت معمول ایجاد پیام در صفحات HTML درج عبارات متنی بین علامت های <-- !--> است، همانطور که در نمونه فرمت بالا مشخص است این شرط ها نیز مبتنی بر همین قاعده هستند و عبارات دستوری if IE و endif به صورت پیام درج شده اند.
- علت درج دستورات شرطی به صورت پیام این است که سایر مرورگرها نسبت به آن بی تفاوت باشند و صرفا به عنوان پیام یادآوری متن را پردازش کنند و خروجی در صفحه چاپ نشود.
- با توجه به دستور [if IE] در نسخه های مرورگر اکسپلورر هر آنچه که مابین دو تگ پیام درج شده به صورت متن یا دستور عادی تفسیر می شود، در واقع مقادیر موجود در این شرط برای اینترنت اکسپلورر حالت پیام صرف ندارد و به شکل متن قابل استفاده است اما سایر مرورگرها با آن مشابه یک پیام معمولی در صفحات وب برخورد و پردازشی اجرا یا خروجی در صفحه چاپ نمی کنند.
- درون این شرط ها می توانیم هر عبارت یا کدی قرار دهیم و صرفا محدود به درج استایل CSS نیست، به طور مثال می توانیم به کاربر پیامی مبنی بر اینکه مرورگر او قدیمی و منسوخ شده است نمایش دهیم و بخواهیم که از مرورگر به روزتر دیگری استفاده کند:
<!--[if IE]>
کاربر گرامی لطفا از مرورگر دیگری به غیر از اینترنت اکسپلورر استفاده کنید!
<![endif]-->
- این پیام های شرطی باید بعد از استایل اصلی و پیش فرض قالب که مخصوص تمام مرورگرها است ترجیحا در قسمت هدر و بین تگ های head قرار گیرند.

تنظیمات مخصوص نسخه های مختلف مرورگر اینترنت اکسپلورر


در ادامه آموزش لیست تقریبا کاملی از تنظیمات استایل CSS مخصوص نسخه های مختلف مرورگر اینترنت اکسپلورر به همراه توضیحات آنها را درج کرده ایم.
درج استایل مخصوص مرورگر اینترنت اکسپلورر در صفحه (تمام نسخه ها)
<!--[if IE]>
<link href="style/ie.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
توضیح:
- if به معنی اگر و IE مخفف اینترنت اکسپلورر (Internet Explorer) است.
درج استایل مخصوص مرورگر اینترنت اکسپلورر نسخه 6
<!--[if IE 6]>
<link href="style/ie6.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
توضیح:
-در صورتی که استایلی در فایل ie6.css داشته باشیم خاصیت های آن در مرورگر اینترنت اکسپلورر نسخه 6 با خواص مشترک استایل اصلی جایگزین خواهند شد.
درج استایل مخصوص مرورگر اینترنت اکسپلورر نسخه 7
<!--[if IE 7]>
<link href="style/ie7.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
درج استایل مخصوص مرورگر اینترنت اکسپلورر نسخه 8
<!--[if IE 8]>
<link href="style/ie8.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
درج استایل مخصوص مرورگر اینترنت اکسپلورر نسخه 9
<!--[if IE 9]>
<link href="style/ie9.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
درج استایل مخصوص مرورگر اینترنت اکسپلورر نسخه بالا تر از 6
<!--[if gt IE 6]>
<link href="style/gtie6.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
توضیح:
- عبارت gt به معنی greater than یا بزرگتر از است.
درج استایل مخصوص مرورگر اینترنت اکسپلورر نسخه بالا تر از 7
<!--[if gt IE 7]>
<link href="style/gtie7.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
درج استایل مخصوص مرورگر اینترنت اکسپلورر نسخه بالا تر از 8
<!--[if gt IE 8]>
<link href="style/gtie8.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
درج استایل مخصوص مرورگر اینترنت اکسپلورر نسخه پائین تر از 7
<!--[if lt IE 7]>
<link href="style/ltie7.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
توضیح:
- عبارت lt به معنی less than یا کوچکتر از است.
درج استایل مخصوص مرورگر اینترنت اکسپلورر نسخه پائین تر از 8
<!--[if lt IE 8]>
<link href="style/ltie8.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
درج استایل مخصوص مرورگر اینترنت اکسپلورر نسخه پائین تر از 9
<!--[if lt IE 9]>
<link href="style/ltie9.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
درج استایل مخصوص مرورگر اینترنت اکسپلورر نسخه 6 و بالا تر از 6
<!--[if gte IE 6]>
<link href="style/gteie6.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
توضیح:
- عبارت gte به معنی greater than equal یا بزرگتر مساوی است.
درج استایل مخصوص مرورگر اینترنت اکسپلورر نسخه 7 و بالا تر از 7
<!--[if gte IE 7]>
<link href="style/gteie7.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
درج استایل مخصوص مرورگر اینترنت اکسپلورر نسخه 8 و بالا تر از 8
<!--[if gte IE 8]>
<link href="style/gteie8.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
درج استایل مخصوص مرورگر اینترنت اکسپلورر نسخه 7 و پائین تر از 7 
<!--[if lte IE 7]>
<link href="style/lteie7.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
درج استایل مخصوص مرورگر اینترنت اکسپلورر نسخه 8 و پائین تر از 8
<!--[if lte IE 8]>
<link href="style/lteie8.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
درج استایل مخصوص مرورگر اینترنت اکسپلورر نسخه 9 و پائین تر از 9
<!--[if lte IE 9]>
<link href="style/lteie9.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
درج استایل برای حالتی که مرورگر کاربر اینترنت اکسپلورر نباشد
<!--[if !IE]>
<link href="style/notie.css" rel="stylesheet" type="text/css" media="screen">
<![endif]-->
توضیح:
- کاراکتر علامت تعجب (!) برای منفی سازی پیام شرطی استفاده می شود.

هک های مخصوص اینترنت اکسپلورر


علاوه بر روش های بالا در موارد خیلی خاصی می توان از حفره ها و اشکالات موجود در مرورگرها جهت مقاصد خیرخواهانه استفاده کرد!، از این نظر شاید وجود حفره در نرم افزارها همیشه هم بد نباشد هرچند بهتر است پدیدآورندگان برنامه ها زمان بیشتری برای رفع مشکلات اختصاص دهند تا کاربران مجبور به استفاده از این شیوه ها نشوند، در هر صورت اصطلاح هک CSS در مرورگرهای مختلف بی شباهت به مفهوم کلی هک که به طور معمول با آن آشنایی داریم نیست، به عبارتی در اینجا نیز از نقایص موجود در برنامه نویسی مرورگر استفاده می کنیم با این تفاوت که هدف ما صرفا تنظیم ظاهر صفحه وب و رفع مشکلات ناخواسته آن است، بحث هک در CSS جزئیات زیادی دارد به همین دلیل در این مطلب صرفا به ذکر چند نمونه اکتفا می کنیم، البته به یاد داشته باشیم در کل استفاده از هک CSS توصیه نمی شود چرا که بهتر است حتی المقدور بر سلکتورها و خاصیت های استاندارد CSS تکیه داشته باشیم از طرفی این هک ها در مرورگرهای مختلف که از به روز رسانی های متفاوتی استفاده می کنند، به شکل واحدی ممکن است پردازش نشوند.

هک با عبارت html+*


در این روش یک آی دی یا کلاس را هم به صورت عادی و هم با درج عبارت html+*  در ابتدا تعریف می کنیم، به عنوان مثال در نمونه کد زیر دو ویژگی متفاوت برای یک آی دی تعریف کرده ایم، قسمتی که عبارت html+* در ابتدای آن قرار دارد تنها در مرورگر IE 7 پردازش می شود.
<style type="text/css">
#my-id{
    border:#333 2px dotted;
}
*+html #my-id{
    border:#333 4px solid;
}
</style>

هک با زیر خط یا underline


روش هک زیر خط یا underline که عنوان دیگر آن underscore است برای هک نسخه های مختلف اینترنت اکسپلورر مخصوصا نسخه 6 کاربرد دارد، در این روش در همان آی دی یا کلاس هدف ویژگی مورد نظر را با یک زیرخط در ابتدا تعریف می کنیم.
<style type="text/css">
body{
    font-size:18px;
    font-family:Arial, Helvetica, sans-serif;
    _font-size:10px;
    _font-family:Tahoma, Geneva, sans-serif;
}
</style>

هک با استفاده از علامت ستاره *


روش هک با علامت ستاره * برای مرورگر اینترنت اکسپلورر نسخه 7 به پائین به کار می رود، در این روش برای عناصر خاص اکسپلورر یک ستاره در ابتدای آنها قرار می دهیم.
<style type="text/css">
.my-class{
    background-color:#CCC;
    *background-color:#0CC;
}
</style>

هک با قرار دادن عبارت 9\


این شیوه هک برای مرورگر اینترنت اکسپلورر نسخه 9 یا 8 و پائین تر به کار می رود، در این روش برای ویژگی خاص اکسپلورر عبارت 9\ را به انتهای خاصیت اضافه می کنیم.
<style type="text/css">
.my-class{
    background-color:#CCC;
    background-color:#0CC\9;
}
</style>
در پایان این آموزش یادآور می شویم که استفاده از استایل CSS مخصوص مرورگر اکسپلورر برای قالب صفحه وب تنها در شرایطی ضروری است که اشکال یا ایراد قابل توجهی در نسخه بخصوصی مشاهده شود، در غیر اینصورت بهتر است همواره از یک استایل استاندارد و واحد برای تمام مرورگرها استفاده کنیم.
sectionدسته بندی: آموزش کاربردی » CSS
related مطالب بیشتر:
» تنظیم موقعیت در وسط و حذف حاشیه ها با CSS
» ایجاد بلاک و تصویر شفاف (Transparent) با استفاده از CSS3
» حذف اسکرول افقی (Horizontal Scroll) با CSS
» ایجاد منو برای سایت یا وبلاگ با استفاده از CSS
» ساخت منوی کشویی با تگ ul li و CSS
commentنظرات (۲۴ یادداشت برای این مطلب ارسال شده است)
more یادداشت های جدید بر اساس تاریخ ارسال در انتهای یادداشت های موجود نمایش داده می شوند.
نویسنده: فريبا
زمان: ۱۴:۵۸:۳۱ - تاریخ: ۱۳۹۱/۰۵/۱۸
سلام
از مطالب عاليتون ممنونم.
سوال: چطوري ميتونيم يه div ايه كه براي فوتر صفحه تعريف كرديم طوري تنظيم كنيم كه هميشه به پائين صفحه بچسبه يعني اگه صفحه رو كوچيك يا بزرگ كنيم همچنان به پائين صفحه چسبيده باشه.
پيشاپيش از جواب و توجهتان ممنونم.
پاسخ: 
اگر منظور شما طراحی فوترهای معمول برای قالب های وب است، کافی است بلاک div مورد نظر را در انتهای سایر بلاک ها قرار دهید و برای تنظیم آن از ویژگی های CSS استفاده کنید، گاهی نیاز است که بین بلاک ها از یک بلاک با استایل زیر نیز استفاده کنید تا لایه ها دقیقا در زیر یکدیگر قرار گیرند:
clear:both;
همچنین اگر می خواهید صفحه شما همیشه حداقل ارتفاعی داشته باشد نیز می توانید از خصوصیت زیر استفاده کنید:
min-height:600px;
اما اگر منظور شما ایجاد یک تولبار در پائین صفحه است که با جابجایی نوار اسکرول همچنان سر جای خود باقی بماند، می توانید از کلاس زیر استفاده کنید:
.toolbar{
bottom:0;
height:25px;
position:fixed;
right:0;
width:100%;
z-index:1000;
border:1px #C00 solid;
}
البته این کلاس در مرورگر اینترنت اکسپلورر نسخه 6 به درستی کار نمی کند، در کل تنظیم بلاک های div در طراحی وب نیاز به کمی تجربه در CSS دارد.
نویسنده: yas
زمان: ۱۷:۵۲:۴۶ - تاریخ: ۱۳۹۱/۰۸/۱۶
مرسی باحال بود
نویسنده: amirhossein
زمان: ۱۷:۵۵:۲۰ - تاریخ: ۱۳۹۲/۰۴/۱۳
سلام خوب هستی ممنون از آموزش های مفیدتون من حداکثر استفاده رو بردم جالب بود هیچ سایتی به اندازه شما به خوبی واضح اموزش نمیدهند
من اینجا چندتا سوال داشتم ممنون میشم جواب بدین
1- در css اگر بخواهیم از بکگراند استفاده کنیم کدام شیوه درست تر است
background:url(images/bg-body.gif);
background:url('images/bg-body.gif');
استفاده از علامت ' ' بین همه کد هایی که () استفاده میشه ضروری است ؟ من حالا بک گراند رو مثال زدم
2- ممنون میشم کد جاوا اسکریپتی واسم بنویسید که وقتی کاربر با مرورگر اسکپلورر همه ورژن ها فرقی نداره وارد سایت شد یه پیغام بده که مرورگر خود را عوض کنید و اجازه ورود نده فقط پیغام
پاسخ: 
سه روش زیر در آدرس دهی قسمت URL در خاصیت های CSS معتبر است:
- استفاده از علامت های ' '.
- استفاده از علامت های " ".
- درج آدرس بدون علامت (روش توصیه شده).
در مورد کد جاوا اسکریپت، کدی که مانع بارگذاری صفحه شود را به دلیل کمبود فرصت نمی توان نوشت، اما کد زیر پس از نمایش پیام، کاربر را به یک آدرس مشخص می فرستد:
<script type="text/javascript">
if (navigator.appName == "Microsoft Internet Explorer") {
alert("لطفا از مرورگر دیگری به جزء اینترنت اکسپلورر استفاده کنید");
document.location = "http://webgoo.ir";
}
</script>
نویسنده: amirhossein
زمان: ۰۴:۴۱:۴۸ - تاریخ: ۱۳۹۲/۰۴/۱۴
خیلی ممنون گلم امیدوارم همیشه موفق باشی
چرا شما تو جاوا اسکریپت بعد از تک های اسکریپت شروع این را میگذارید <!-- پایان هم این // --> نذاری هم جواب میده که اگه جسارت شد شرمنده
پاسخ: 
علامت های درج شده برای این است که برخی مرورگرها (مانند برخی مرورگرهای موبایل و...) که امکان پردازش جاوا اسکریپت را ندارند، کدها را به صورت متن چاپ می کنند، با این علامت ها از این کار جلوگیری می شود، نکته دوم بحث اعتبار سنجی در کدنویسی HTML است که در برخی نسخه ها (نسخه های XHTML)، تداخل جاوا اسکریپت و HTML در یک فایل ممکن است باعث نامعتبر شدن کدنویسی شود، پس بهتر است از این علامت ها یا روش CDATA استفاده شود، مگر اینکه واقعا مطمئن باشید که احتیاجی به آنها نیست (به طور مثال در HTML5 احتیاجی به این موارد نیست).
نویسنده: amirhossein
زمان: ۱۵:۱۵:۳۹ - تاریخ: ۱۳۹۲/۰۴/۱۴
خیلی ممنون اون کد جاوا اسکریپتی که نوشتین عمل نکرد واسه منم بازم ممنون میشه بگین تفاوت بین کلاس و آی دی در سی اس اس چیه من هر کاری می کنم بازم نفهمیدم همه یه نظری میدن که کاملا فرق میکنه میخوام حرف شما رو هم بدانم تفاوتش در چیست
من فکر می کنم که اگه بخوایم با ای دی استفاده کنیم به طور مثال
<div id="main"></div>
فقط یک بار میشه استفاده کرد
اما از کلاس میشه تکرار کرد مثال
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
<div class="post"></div>
اما ای دی رو نمیشه به این صورت تکرار کرد
<div id="post"></div>
<div id="post"></div>
<div id="post"></div>
<div id="post"></div>
<div id="post"></div>
<div id="post"></div>
من تو همه سایت ها که سرچ کردم با توضیح هاتشون آخر به این نتیجه رسیدم آیا طرز فکر من درسته یا خیر؟
پاسخ: 
کد جاوا اسکریپت کاملا تست شده و عمل می کند، احتمال دارد کد را در مرورگری به غیر از اکسپلورر اجرا کرده باشید که قاعدتا نباید اتفاق خاصی بیفتد یا اینکه خطاهایی در دیگر کدهای به کار رفته در صفحه وجود دارد و مواردی از این دست.
در مورد کاربرد کلاس و آی دی و تفاوتشان برداشت شما صحیح است، برای دیدن توضیحات بیشتر، مطلبی در سایت در همین خصوص وجود دارد، عبارت "کلاس" را در قسمت جستجو وارد کنید.
نویسنده: amirhossein
زمان: ۱۵:۲۰:۲۳ - تاریخ: ۱۳۹۲/۰۴/۱۴
میگم در هر صفحه اچ تی ام ال فقط یک آی دی میتونه تعریف بشه این یعنی چی؟
یعنی تو کل قالب فقط میتوان یک آی دی تعریف کرد ولی من در بعضی از قالب ها دیدم چندین ای دی استفاده شده
پاسخ: 
تنها یک آی دی یکتا می توان تعریف کرد، یعنی شما می توانید هر تعداد آی دی با نام متفاوت داشته باشید، این موضوع به جهت فلسفه خاص آی دی (که باید برای هر عنصر خاص و یکتا باشد) است.
نویسنده: amirhossein
زمان: ۱۵:۳۶:۴۰ - تاریخ: ۱۳۹۲/۰۴/۱۴
لطفا این رو هم ببینید سورس کد هام هست درسته یا خیر؟
<div id="main">
<div id="header"><img src="http://s2.picofile.com/file/7830805585/header.gif" width="800" height="163" /></div>
<div id="sidebar"></div>
<BLOGFA>
<div class="post">
<div class="post-content"><a target="_blank" href="<-PostLink->"><-PostTitle-></a></div>
<div class="post-body">
<-PostContent-><BlogPostTagsBlock><br />برچسب ها: <BlogPostTags separator=", "><a dir="rtl" href="<-TagLink->"><-TagName-></a></BlogPostTags></BlogPostTagsBlock><BlogExtendedPost><br /><a target="_blank" href="<-PostLink->"><b>ادامه مطلب</b></a></BlogExtendedPost>
</div>
<div class="post-content">نوشته شده در تاریخ <-PostDate-> و ساعت
<-PostTime-> توسط <-PostAuthor-> <BlogComment><script type="text/javascript">GetBC(<-PostId->);</script></BlogComment></div>
</div>
</BLOGFA>
<div id="footer"><img src="http://s2.picofile.com/file/7830805157/footer.gif" width="798" height="163" /></div>
</div>
پاسخ: 
از نظر برنامه نویسی خطای خاصی وجود ندارد.
نویسنده: amirhossein
زمان: ۱۸:۲۲:۳۸ - تاریخ: ۱۳۹۲/۰۴/۱۴
خیلی ممنون از کمک و لطف شما اگه باعث اذیتتون شدم شرمنده زیاد سوال میکنم خیلی ممنون
نویسنده: amirhossein
زمان: ۱۹:۳۲:۲۰ - تاریخ: ۱۳۹۲/۰۴/۱۴
سلام یه سوال دیگه داشتم
transition:all 0.5s ease-out;
چرا این کد توی اینترنت اسکپلورر اجرا نمیشه؟
پاسخ: 
این قابلیت جزء خاصیت های CSS3 است که در مرورگر اینترنت اکسپلورر از نسخه 10 پشتیبانی می شود.
نویسنده: امیرحسین
زمان: ۲۳:۰۳:۳۵ - تاریخ: ۱۳۹۲/۰۴/۱۴
خیلی گلی داداش ممنون
نویسنده: سینا
زمان: ۱۹:۳۹:۴۹ - تاریخ: ۱۳۹۲/۰۶/۲۸
با سلام وخسته نباشید، لازم دونستم یک نکته ی مهم رو متذکر بشم و اون اینه که برای یه شخص تازه کار مشکله که بدونه این تنظیمات در بین کدام استایل های css یا تگ های html به کار میرن! به نظرم بهتر بود با ذکر یک مثال یا پیش نمایش این موضوع رو شفاف تر می کردید. من نه تنها در سایت شما بلکه در هیچ کدوم از وب سایت های فارسی دیگه هم توضیح مناسبی ندیدم، لطفاً حداقل شما با دیگران متفاوت باشید!
پاسخ: 
اگر مطلب را مطالعه کرده باشید، در قسمتی ذکر شده:
"این پیام های شرطی باید بعد از استایل اصلی و پیش فرض (که مخصوص تمام مرورگرها است) ترجیحا در قسمت هدر و بین تگ های head قرار گیرند."
نویسنده: محمدحسین
زمان: ۲۰:۱۸:۵۲ - تاریخ: ۱۳۹۲/۱۰/۰۶
لطفاً اگه میشه به سوال اون دوستمون که گفتن: اصلا اجازه ورود با مرورگر اینترنت اکسپلورر رو ندیدم، بدید
پاسخ: 
جاوا اسکریپت امکان محدود کردن کاربران را از این نظر ندارد (تنها در حدی که در پاسخ گفته شده و آن هم در صورت فعال بودن جاوا اسکریپت در مرورگر)، برای این کار باید از PHP استفاده کنید، مثال:
<?php
if(preg_match('/MSIE/i', $_SERVER['HTTP_USER_AGENT'])){
header("Location: http://webgoo.ir");
exit;
}
?>
نویسنده: محمدحسین
زمان: ۱۶:۲۳:۳۶ - تاریخ: ۱۳۹۲/۱۰/۰۷
باز هم ممنون
نویسنده: محمدحسین
زمان: ۱۹:۵۰:۱۱ - تاریخ: ۱۳۹۲/۱۰/۰۷
تو مرورگری مثل اینترنت اکسپلورر برای اجرای جاوا اسکریپت باید اول قابلیت اجرای جاوا فعال بشه که این کار همون اول که کاربر سایت رو باز میکنه؛ پایین مرورگر یه پیام میده و از کاربر اجازه میگره برای باز شدن فایلهای جاوا اسکریپت. وقتی که با جاوا پیام میدیم که مرورگر رو عوض کن، یه بخشی از سایت باز میشه و اگر کاربر اجازه باز شدن اسکریپت رو بده. اگه نده که میشه قوز بالا قوز. نصف سایت باز میشه بدون اینکه فایل های جاوا اجرا شده باشن و پیامی دریافت کنه که مرورگر رو عوض کنه...!
این مشکل رو بررسی کنید لطفا مررررررررررررررررررررررسی
پاسخ: 
در پاسخ قبلی گفته شد: جاوا اسکریپت برای اینگونه موارد مناسب نیست، باید از یک زبان سمت سرور مانند PHP استفاده کنید (که در وبلاگ ها به دلیل عدم پشتیبانی از PHP این امکان وجود ندارد).
نویسنده: شکوفه
زمان: ۱۳:۲۹:۱۰ - تاریخ: ۱۳۹۲/۱۲/۱۲
سلام ممنون از آموزشتان.سوالی که داشتم در مورد اجرا نشدن media query در اینترنت اکسپلورر است. چطور اجرا شود؟
ممنون اگر آموزش بدید
پاسخ: 
برای مرورگر اینترنت اکسپلورر متاتگ زیر را در صفحه وارد کنید:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
همچنین برای پشتیبانی ورژن های پائین اکسپلورر (نسخه 8 و ماقبل) باید فایل js در صفحه خود داشته باشید:
<!--[if lt IE 9]>
<script src="http://css3-mediaqueries-js.googlecode.com/svn/trunk/css3-mediaqueries.js"></script>
<![endif]-->
more لطفا پیش از ارسال یادداشت نکات زیر را مد نظر داشته باشید:
- مواردی که به کلی خارج از موضوع این مطلب هستند را در فرم منوی "تماس با ما" مطرح و پاسخ را از طریق ایمیل دریافت کنید.
- به سوالات کلی، مبهم، غیرضروری و مشکلاتی که تلاشی برای رفع آن نکرده باشید پاسخ کوتاه و مختصر داده خواهد شد!
- کدها و اسکریپت های طولانی را ترجیحا در یک صفحه وب آنلاین قرار دهید تا امکان تست و بررسی وجود داشته باشد.
- تمام یادداشت ها بررسی و برای هر کاربر زمان مشخصی جهت پاسخگویی در نظر گرفته می شود، لطفا از طرح سوالات متعدد در بازه زمانی کوتاه خودداری کنید.





4 × 4
 refresh
آخرین دیدگاه ها
more برای دسترسی سریع به یادداشت مربوطه می توانید از لینک مطلب در کادر زیر استفاده کنید.
form مهدی
در:
خیلی خیلی ممنونم از وقتی که گذاشتید.. لطف کردید
۲۱:۵۳:۳۵ ۱۳۹۹/۰۴/۲۴

form mahtab
در:
ببخشین چرا وبلاگ من تو لبتاپ دوستم باز نمیشه ؟؟؟ واسه ی ویروس هم اسکن کرده اما نوشته چیزی نیس چیکار کنیم ؟؟؟؟ ...
۱۴:۳۲:۳۳ ۱۳۹۹/۰۴/۲۴

form مهدی
در:
تبدیل کنم؟
۱۲:۱۸:۲۸ ۱۳۹۹/۰۴/۲۴

form sepideh
در:
سلام. من یک لندینگ پیج رو به صفحه اصلی سایت ریدایرکت 301 کردم. اگر بخوام تمام لینک های داخلی لندینگ رو (صفحات دنباله) رو...
۱۷:۱۱:۴۰ ۱۳۹۹/۰۴/۲۳

form ا
در:
ببخشید کدها رو کجا میزنیم؟
۱۵:۳۲:۵۷ ۱۳۹۹/۰۴/۲۳

form نیلوفر
در:
سلام. من تازه کار هستم و توی سایتی که طراحی کردم یه سرچ باکس گذاشتم. ارتباط با پایگاه داده هم داره و نتایج رو نشون...
۱۲:۵۳:۴۳ ۱۳۹۹/۰۴/۲۳

form مهدی
در:
سلام من از کد زیر استفاده کردم ولی وقتی که اعمال میشه کل css های سایتم میپره.. چه باید بکنم
۰۹:۵۵:۵۰ ۱۳۹۹/۰۴/۲۳

form سلماسی
در:
سلام ایا اگر از وبسایت شخصی کسی بازدید کنیم صاحب وبسایت شماره ی ما را می بیند
۲۱:۳۱:۵۳ ۱۳۹۹/۰۴/۲۲

form mahdi
در:
سلام استاد اگه براتون زحمتی نیست یه نگاه دیگه بهش بندازید ، الان ریموو ادیت درست هستن فقط برای نمایش کلیشون که وقتی رفرش میکنیم...
۱۹:۱۳:۱۵ ۱۳۹۹/۰۴/۲۲

form mahdi
در:
سلام استاد عزیز ، میتونید یه نمونه که فقط با جاوا اسکریپت کار شده نه با فریمورکاش بهم معرفی کنید ببینم؟ من هرچی گشتم پیدا...
۱۴:۴۶:۲۴ ۱۳۹۹/۰۴/۲۲

form mahdi
در:
سلام استاد عزیز و گرامی ، یه دفتر چه یادداشت با localstorage میخوام بنویسم ولی مشکل دارم، دو تا سوال دارم ممنون میشم راهنماییم...
۱۲:۰۵:۰۷ ۱۳۹۹/۰۴/۲۲

form اریا
در:
سلام و درود بزرگوار چه دستوری باید بنویسیم تا فقط مقدارهای خاصی از ارایه بتونیم نمایش بدیم. مثلا یک ارایه 6 خونه ای...
۱۶:۴۷:۳۱ ۱۳۹۹/۰۴/۲۰

form کافه کتاب
در:
سپاس خیلی وقت بود دنبالش بودم مرسی از سایت عالیتون
۱۴:۵۱:۴۳ ۱۳۹۹/۰۴/۲۰

form سجاد
در:
دمتون گرم. خیلی زحمت کشیدید
۱۳:۴۳:۱۱ ۱۳۹۹/۰۴/۲۰

form KhashayarPrk
در:
سلام. میخوام الگو تمام کلمات داخل پرانتز رو بدون پرانتز بریزه ارایه با این کد فقط یک پرانتز رو جواب میده.
۱۳:۱۳:۴۷ ۱۳۹۹/۰۴/۲۰
form Oliver
در:
چطوری دستور background رو برای جدلمون عکسش رو تنظیم کنیم و بهش طول و عرض بدیم
۱۶:۰۷:۱۷ ۱۳۹۹/۰۴/۱۸
form محمد
در:
با عرض سلام ببخشید چطوری میتونم واسه اشتراک کاربر انقضا بزارم مثلا یک ماه داخل دیتابیس ردیف تایم رو درست کردم البته تاریخ رو تبدیل...
۱۹:۱۴:۵۹ ۱۳۹۹/۰۴/۱۵
form آیدا
در:
سلام من در حال طراحی با html هستم اما طبق فیلم آموزشی پیش میرم از یه جایی به بعد هم تغییرات اعمال نمیشه...
۲۲:۴۷:۴۴ ۱۳۹۹/۰۴/۱۴
form علی
در:
سلام اگه میشه یه تکه کدی بفرستید که کاربر نتونه عکس مورد نظر رو دانلود کنه و با نگه داشتن روی عکس فقط لینکو ببینه...
۰۹:۳۰:۴۹ ۱۳۹۹/۰۴/۱۴
form sina2000
در:
با سلام و خسته نباشید طبق کد زیر استفاده میگه متغیر Pdc برای PDO است لطفا نمونه کد برای لایبرری...
۱۵:۰۳:۵۱ ۱۳۹۹/۰۴/۱۳
form محمد امین
در:
سلام ممنون از مطلبتون ببخشید من یه سایتی با شی گرایی کامل زدم الان میخوام آدرسشو بهینه کنم آدرس الان من به این صورته:...
۱۸:۲۸:۲۴ ۱۳۹۹/۰۴/۱۱
form ترنم
در:
سلام وقتتون بخیر ببخشید من کدهای مربوط منو و زیر منو رو نوشتم ولی موقع اجرا منوی اصلی رو میاره ولی زیر منوها رو...
۱۱:۰۶:۲۹ ۱۳۹۹/۰۴/۱۱
form ا
در:
سلام چرا وقتی مطالب مربوط که تو وبلاگم هست رو جستجو میکنم نمیاره ؟؟؟
۲۰:۳۱:۰۸ ۱۳۹۹/۰۴/۰۷
form amir
در:
سلام من اگه بخوام با وارد کردن یه id داخل یک text کل اون ردیف پاک بشن باید چه کنم مثلا یک text دریافت میکنم...
۰۱:۴۸:۰۵ ۱۳۹۹/۰۴/۰۷
form محمدباقر حسیبیان
در:
من این مشکل برام پیش اومده که موقع ورود به پروژه م توی لوکال هاست wamp صفحه سفیده و هیچی رو نشون نمیده و کد...
۱۶:۴۲:۳۸ ۱۳۹۹/۰۴/۰۶
form ...
در:
سلام دو سایت نوشته ای مربوط به من رو چند سال قبل لینک دانلود قرار دادن من ازشون خواستم بردارنش ولی اینکارو نکردن سایت...
۱۷:۲۶:۴۲ ۱۳۹۹/۰۴/۰۵
form مجتبی
در:
سلام میشه یک کد جاوا رو به php تبدیل کرد تا لود سایت سریع تر بشه؟
۱۳:۰۴:۲۳ ۱۳۹۹/۰۴/۰۴
form متین
در:
سلام ؛ من تازه شروع به یادگیری کردم ؛ مطلب بسیار کاربردی بود ؛ ممنون از شما دوست عزیز.
۰۱:۵۰:۰۵ ۱۳۹۹/۰۴/۰۴
form mahdi
در:
سلام استاد عزیز و گرامی امیدوارم که حالتون خوب باشه ، اگه براتون ممکنه لطفا یه آموزش خوب در زمینه وردپرس بهم معرفی کنید ،...
۲۱:۴۸:۱۳ ۱۳۹۹/۰۴/۰۳
form امید
در:
در برنامه نویسی کاربر با چه دستوری میتواند به صفحه اصلی برگردد
۱۹:۰۶:۵۶ ۱۳۹۹/۰۴/۰۳
form ali
در:
با سلام من یک پروژه طراحی کردم میخوام که وقتی کاربر روی ادامه مطلب کلیک کرد در خود صفحه بقیه مطالب را ببینه...
۱۸:۴۷:۲۲ ۱۳۹۹/۰۴/۰۳
form علی
در:
سلام و تشکر از زحمات ارزشمند شما احتراما بنده امروز از یک شماره تلفن ثابت از طریق یک رایانه و یک موبایل به طور...
۱۸:۰۱:۱۰ ۱۳۹۹/۰۴/۰۳
form oscar
در:
درود. اگر بخوایم در نمایش تاریخ و زمان که به صورت لحظه ای خودش در صفحه رفرش میشه، فقط عبارت " Mon Jun 22 2020...
۱۵:۵۹:۳۲ ۱۳۹۹/۰۴/۰۲
form علی
در:
با سلام چطور میشه فقط یک صفحه مورد نظرمون رفرش بشه نه همه صفحات سایت
۰۰:۰۳:۴۱ ۱۳۹۹/۰۳/۳۱
form Farzad
در:
الان وقتی فایل رو میخواد دانلود بکنه از خودش فایل میسازه ، به این صورت یعنی بعد از پوشه file هر پوشه ای باشه...
۱۸:۵۶:۲۱ ۱۳۹۹/۰۳/۳۰
form Farzad
در:
سلام ، خسته نباشید من فایل هایی که در هاست میزارم به این شکل هست: یعنی مشخص نیست فایل ها تو چه پوشه...
۱۳:۳۳:۴۰ ۱۳۹۹/۰۳/۳۰
form شیما طیبی
در:
سلام خیلی مطلب مفیدی بود . همیشه به وبلاگ نویسی به چشم یه کار خسته کننده نگاه میکردم ولی خب یه مقدار نظرم تغییر کرد....
۲۳:۵۲:۳۲ ۱۳۹۹/۰۳/۲۹
در انتظار بررسی: ۰