English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
تُحدد خاصية link media لخصائص الوسائط كيفية تحسين المصدر المستهدف لكل وسائط/أجهزة، وتُستخدم هذه الخاصية عادةً مع جدول الأنماط CSS لتعيين أنماط مختلفة لكل نوع وسائط.
استخدام جدول استyles مختلفين لكل نوع وسائطين مختلفين (الشاشة والطباعة):
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>استخدام خاصية hreflang لـ <link> في HTML - تعليمات أساسية (oldtoolbag.com)</title> <link rel="stylesheet" type="text/css" href="demo_screen.css"> <link rel="stylesheet" type="text/css" href="demo_print.css" media="print"> </head> <body> <h1>oldtoolbag.com مثال</h1> <p><a href="tryhtml_link_media.html" target="_blank">انقر هنا</a> لفتح هذه الصفحة في نافذة جديدة (بدون جزء tryit).</p> <p>إذا قمت بطباعة هذه الصفحة أو فتحها في عرض الطباعة، فإنك ستشاهد أنّها تستخدم جدول استyles مع خاصية media="print" لتحديد الأنماط. جدول الأنماط "الطباعة" يحتوي على نص أسود على خلفية بيضاء.</p> </body> </html>التحقق من ‹/›
IEFirefoxOperaChromeSafari
يدعم جميع المتصفحات الرئيسية خصائص الوسائط.
خصائص الوسائط تُحدد أي وسائط/أجهزة تم تحسين المصدر المستهدف لها.
يُستخدم هذا الميزة عادةً مع جدول الأنماط CSS لتعيين أنماط مختلفة للأنواع المختلفة من وسائل الإعلام.
يمكن للميزة قبول عدة قيم.
يُدعم الآن قيمة mediacهذا الميزة قيمًا أكثر.
<link media="value>
| القيمة | الوصف |
|---|---|
| and | يحدد عملاً AND. |
| not | يحدد عملاً NOT. |
| , | يحدد عملاً OR. |
| القيمة | الوصف |
|---|---|
| all | المبدأ الأساسي. ينطبق على جميع الأجهزة. |
| aural | المحول الصوتي. |
| braille | جهاز التعرف على الأصابع العمياء. |
| handheld | الأجهزة المحمولة (شاشة صغيرة، نطاق تردد محدود). |
| projection | المشروعور. |
| عرض الطباعة المسبق/صفحة الطباعة. | |
| screen | شاشة الكمبيوتر. |
| tty | الآلات المكتوبة الكهربائية وأجهزة مثلها التي تستخدم شبكة الأحرف المساوية. |
| tv | أجهزة التلفزيون (دولجة، قدرة على التمرير المحدودة). |
| القيمة | الوصف |
|---|---|
| width | يحدد العرض للمنطقة المستهدفة. يمكن استخدام المقدمة "min-" و "max-". مثال: media="screen and (min-width:500px)" |
| height | يحدد الارتفاع للمنطقة المستهدفة. يمكن استخدام المقدمة "min-" و "max-". مثال: media="screen and (max-height:700px)" |
| device-width | يحدد العرض للشاشة المستهدفة/ورق. يمكن استخدام المقدمة "min-" و "max-". مثال: media="screen and (device-width:500px)" |
| device-height | يحدد الارتفاع للشاشة المستهدفة/ورق. يمكن استخدام المقدمة "min-" و "max-". مثال: media="screen and (device-height:500px)" |
| orientation | يحدد اتجاه الشاشة المستهدفة/ورق. القيم الممكنة: "portrait" أو "landscape". مثال: media="all and (orientation: landscape)" |
| aspect-ratio | يحدد نسبة العرض/الارتفاع للمنطقة المستهدفة. يمكن استخدام المقدمة "min-" و "max-". مثال: media="screen and (aspect-ratio:16/9)" |
| device-aspect-ratio | يحدد نسبة عرض/طول الشاشة المستهدفة/ورق. يمكن استخدام المقدمة "min-" و "max-". مثال: media="screen and (aspect-ratio:16/9)" |
| color | يحدد عدد الأجزاء/الألوان للشاشة المستهدفة. يمكن استخدام المقدمة "min-" و "max-". مثال: media="screen and (color:3)" |
| index اللون | يحدد عدد الألوان التي يمكن معالجتها من قبل الشاشة المستهدفة. يمكن استخدام المقدمة "min-" و "max-". مثال: media="screen and (min-color-index:256)" |
| أحادية الألوان | يحدد bits/pixel في حافظة الشاشة أحادية الألوان. يمكن استخدام المقدمة "min-" و "max-". مثال: media="screen and (monochrome:2)" |
| كثافة | يحدد كثافة البكسل (dpi أو dpcm) للشاشة المستهدفة/ورق. يمكن استخدام المقدمة "min-" و "max-". مثال: media="print and (resolution:300dpi)" |
| مسح | يحدد طريقة مسح جهاز العرض التلفزيوني. القيم الممكنة: "progressive" و "interlace". مثال: media="tv and (scan:interlace)" |
| شبكة | يحدد ما إذا كان جهاز الإخراج هو شبكة أو بيانوسيارة. القيم الممكنة: "1" هو شبكة، وإلا "0". مثال: media="handheld and (grid:1)" |