الفرق بين المراجعتين لصفحة: «CSS/resolution»

من موسوعة حسوب
< CSS
لا ملخص تعديل
 
ط استبدال النص - '\[\[تصنيف:(.*)\]\]' ب'{{SUBPAGENAME}}'
سطر 116: سطر 116:
* مواصفة [https://drafts.csswg.org/css-values-3/#resolution CSS Values and Units Module Level 3].
* مواصفة [https://drafts.csswg.org/css-values-3/#resolution CSS Values and Units Module Level 3].
* مواصفة [https://drafts.csswg.org/mediaqueries-3/#resolution Media Queries].
* مواصفة [https://drafts.csswg.org/mediaqueries-3/#resolution Media Queries].
[[تصنيف:CSS]]
[[تصنيف:CSS|{{SUBPAGENAME}}]]
[[تصنيف:CSS Data Type]]
[[تصنيف:CSS Data Type|{{SUBPAGENAME}}]]

مراجعة 15:34، 28 يناير 2018

نوع البيانات <resolution> في CSS يستعمل لوصف دقة الشاشة في media queries، ودقة الشاشة تعني كثافة البكسلات في جهاز العرض.

لاحظ أنَّ الواحدات المستخدمة مع نوع البيانات هذا ستكون نسبةً إلى البوصات أو السنتميرات أو البسكلات المُعرَّفة في CSS، ولا تساوي بالضرورة القياس الفيزيائي لها على شاشة العرض.

دعم المتصفحات

الميزة Chrome Firefox Internet Explorer Opera Safari
الدعم الرئيسي 29.0 3.5 9.0 9.5 غير مدعومة
ddpx 29.0 16.0 غير مدعومة 12.10 غير مدعومة

الشكل العام

تتألف القيم من النوع <resolution> من عدد <number> موجب تتبعه إحدى الواحدات المذكورة أدناه؛ وكما في جميع القيم في CSS، لا يجوز الفصل بفراغ بين القيمة العددية والواحدة.

الواحدة dpi

تُمثِّل عدد النقاط في كل بوصة (dots per inch)، وتحتوي شاشات الحاسوب العادية 72 أو 96 نقطة في البوصة، لكن قيمة dpi للمستندات المطبوعة أكبر من ذلك بكثير. ولمّا كانت البوصة الواحدة تساوي 2.54cm، فهذا يعني أنَّ 1dpi ≈ 0.39dpcm.

الواحدة dpcm

تُمثِّل عدد النقاط في كل نوع البيانات <resolution> في CSS يستعمل لوصف دقة الشاشة في media queries، ودقة الشاشة تعني كثافة البكسلات في جهاز العرض.

لاحظ أنَّ الواحدات المستخدمة مع نوع البيانات هذا ستكون نسبةً إلى البوصات أو السنتمترات أو البسكلات المُعرَّفة في CSS، ولا تساوي بالضرورة القياس الفيزيائي لها على شاشة العرض.

دعم المتصفحات

الميزة Chrome Firefox Internet Explorer Opera Safari
الدعم الرئيسي 29.0 3.5 9.0 9.5 غير مدعومة
ddpx 29.0 16.0 غير مدعومة 12.10 غير مدعومة

الشكل العام

تتألف القيم من النوع <resolution> من عدد <number> موجب تتبعه إحدى الواحدات المذكورة أدناه؛ وكما في جميع القيم في CSS، لا يجوز الفصل بفراغ بين القيمة العددية والواحدة.

الواحدة dpi

تُمثِّل عدد النقاط في كل بوصة (dots per inch)، وتحتوي شاشات الحاسوب العادية 72 أو 96 نقطة في البوصة، لكن قيمة dpi للمستندات المطبوعة أكبر من ذلك بكثير. ولمّا كانت البوصة الواحدة تساوي 2.54cm، فهذا يعني أنَّ 1dpi ≈ 0.39dpcm.

الواحدة dpcm

تُمثِّل عدد النقاط في كل سنتميتر، ولمّا كانت البوصة الواحدة تساوي 2.54cm، فإنَّ 1dpcm ≈ 2.54dpi.

الواحدة dppx

تُمثِّل عدد النقاط في كل px، ولأنَّ نسبة in إلى px في CSS ثابتة وهي 1:96، فإنَّ 1dppx تساوي 96dpi.

ملاحظة: صحيحٌ أنَّ الرقم 0 يُمثِّل نفس القيمة بغض النظر عن الواحدة، لكن لا يُسمَح بحذف الواحدة في نوع البيانات <resolution>، أي لا يجوز استخدام 0 بمفرده، وإنما يجب أن يكون 0dpi أو 0dpcm أو 0dppx.

أمثلة

أمثلة صالحة تُمثِّل دقة الشاشة:

  • 96dpi
  • 50.82dpcm
  • 3dppx

أمثلة غير صالحة تُمثِّل دقة الشاشة:

  • ‎72 dpi: لا يجوز ترك فراغ بين الرقم والواحدة.
  • ten dpi: يجب استخدام الأرقام فقط.
  • 0: يجب توفير واحدة للرقم 0.

مثال عن استخدام نوع البيانات <resolution> في media query:

@media print and (min-resolution: 300dpi) { ... }

مصادر ومواصفات

، ولمّا كانت البوصة الواحدة تساوي 2.54cm، فإنَّ 1dpcm ≈ 2.54dpi.

الواحدة dppx

تُمثِّل عدد النقاط في كل px، ولأنَّ نسبة in إلى px في CSS ثابتة وهي 1:96، فإنَّ 1dppx تساوي 96dpi.

ملاحظة: صحيحٌ أنَّ الرقم 0 يُمثِّل نفس القيمة بغض النظر عن الواحدة، لكن لا يُسمَح بحذف الواحدة في نوع البيانات <resolution>، أي لا يجوز استخدام 0 بمفرده، وإنما يجب أن يكون 0dpi أو 0dpcm أو 0dppx.

أمثلة

أمثلة صالحة تُمثِّل دقة الشاشة:

  • 96dpi
  • 50.82dpcm
  • 3dppx

أمثلة غير صالحة تُمثِّل دقة الشاشة:

  • ‎72 dpi: لا يجوز ترك فراغ بين الرقم والواحدة.
  • ten dpi: يجب استخدام الأرقام فقط.
  • 0: يجب توفير واحدة للرقم 0.

مثال عن استخدام نوع البيانات <resolution> في media query:

@media print and (min-resolution: 300dpi) { ... }

مصادر ومواصفات