مؤسسة CSS الرؤية

وفقا لحجم الشاشة من عناصر العرض

وسيستند الفئات التالية على الجهاز (حجم الشاشة) إلى عنصر العرض.

يوضح المثال التالي كل ما سبق .show- الدرجة من الوضوح.

<p class="show-for-small-only">你在小型设备上。</p>
<p class="show-for-medium-up">你在中型、大型、更大型、超大型的设备上。</p>
<p class="show-for-medium-only">你在中型设备上。</p>
<p class="show-for-large-up">你在大型、更大型、超大型的设备上</p>
<p class="show-for-large-only">你在大型设备上。</p>
<p class="show-for-xlarge-up">你在更大型、超大型的设备上。</p>
<p class="show-for-xlarge-only">你在更大型设备上。</p>
<p class="show-for-xxlarge-up">你在超大型设备上。</p>

محاولة »

وفقا لعنصر مخفي حجم الشاشة

وسيستند الفئات التالية على الجهاز (حجم الشاشة) لإخفاء العناصر.

<p class="hide-for-small-only">你不在小型设备上。</p>
<p class="hide-for-medium-up">你不在中型、大型、更大型、超大型的设备上。</p>
<p class="hide-for-medium-only">你不在中型设备上。</p>
<p class="hide-for-large-up">你不在大型、更大型、超大型的设备上。</p>
<p class="hide-for-large-only">你不在大型设备上。</p>
<p class="hide-for-xlarge-up">你不在更大型、超大型的设备上。</p>
<p class="hide-for-xlarge-only">你不在更大型设备上。</p>
<p class="hide-for-xxlarge-up">你不在超大型设备上。</p>

محاولة »

عناصر العرض وفقا لاتجاه الشاشة

وسيستند الفئات التالية على الجهاز (حجم الشاشة) لإخفاء العناصر.

فإننا يمكن أن يحدد عنصر في اتجاهات مختلفة، سواء لإظهار أو إخفاء. أجهزة الكمبيوتر المحمولة وغيرها من الأجهزة المكتبية الأفقية بشكل عام، ولكن الهواتف المحمولة وأجهزة الكمبيوتر اللوحي يمكن أن يكون أفقيا أو رأسيا، يمكننا اخفاء وعرض عنصر وفقا لالهاتف المحمول المستخدم للحصول على اتجاهات:

يوضح المثال التالي محتويات النص وفقا لاتجاه الاستخدام:

جهاز عرض تعمل باللمس وإخفاء

يمكنك وفقا لما إذا كان الجهاز يدعم اللمس لعرض العنصر الخفي.

الأمثلة التالية وفقا لما إذا كان الجهاز يدعم اللمس لعرض النص: