الانتقال إلى المحتوى الرئيسي

نمط العرض لا شيء: ما هو وكيفية استخدامه

  • الأستاذ نور الحقّ مرازيق البقوم
  • المدونة

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

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

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

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

  1. العرض على الصفحة: كل ما تحتاج لمعرفته حول نمط العرض بلا
  2. مبادئ التشغيل والتطبيق
  3. أمثلة على استخدام العرض لا شيء
  4. سؤال وجواب
  5. لماذا أحتاج إلى استخدام خاصية" عرض بلا"?
  6. كيف يمكنني استخدام خاصية "عرض بلا" في كس?
  7. كيف يمكنني إعادة عنصر إلى الصفحة إذا كان مخفيا باستخدام "عرض بلا"?

العرض على الصفحة: كل ما تحتاج لمعرفته حول نمط العرض بلا

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

عرض: لا ينطبق أي منها على العناصر التي يجب إخفاؤها من تخطيط الصفحة الأولي وعرضها فقط عند استيفاء شروط أو أحداث معينة.

يمكن أن يكون هذا مفيدا ، على سبيل المثال ، عند تنفيذ العناصر التفاعلية ، وإظهار المحتوى وإخفائه عند النقر فوق زر ، والتحقق من صحة النموذج ، والعديد من السيناريوهات الأخرى.

العرض: لا شيء الملكية لديه الميزات التالية:

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

لجعل عنصر مخفي مرئيا على الصفحة مرة أخرى ، يكفي تغيير قيمته إلى عنصر آخر ، على سبيل المثال ، العرض: حظر أو عرض: مضمن. هذا يسمح لك بالتحكم في رؤية العناصر حسب الحاجة.

ومن الجدير بالذكر أيضا أن استخدام خاصية العرض: لا يمكن لأي منها أن يؤثر بشكل كبير على أداء صفحة الويب ، خاصة مع وجود عدد كبير من العناصر المخفية. لذلك ، يجب أن تكون حذرا وأن تستخدم هذه الخاصية بحكمة.

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

مبادئ التشغيل والتطبيق

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

عنصر مع العرض: لا توجد خاصية لا تصبح غير مرئية للمستخدمين فحسب ، بل لا تتوفر أيضا للتفاعل ، نظرا لأن جميع خصائصها وأحداثها تصبح غير نشطة.

تطبيق خاصية العرض: لا شيء يمكن أن يكون مفيدا في الحالات التالية:

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

استخدام العرض: لا توجد خاصية تسمح لك بالتحكم ديناميكيا في عرض العناصر ، مما يجعلها مرئية أو غير مرئية اعتمادا على السيناريوهات المختلفة وتفاعل المستخدم.

باستثناء خاصية العرض: لا شيء في كس ، وهناك أيضا طرق أخرى لإخفاء العناصر ، مثل الرؤية: مخفي والتعتيم: 0. ومع ذلك ، لديهم سلوك مختلف عن العرض: لا شيء ويمكنهم توفير مساحة على الصفحة أو تغيير رؤية عنصر دون تغيير موضعه في الدفق.

أمثلة على استخدام العرض لا شيء

1. إخفاء عنصر

عرض لا شيء يسمح لك لإخفاء عنصر على الصفحة. في هذه الحالة ، يتم إخلاء المساحة التي يشغلها العنصر ، ويمكن للعناصر الأخرى أن تأخذ هذا المكان إذا لزم الأمر.

مثال الاستخدام:

سيتم إخفاء هذه الكتلة

2. إخفاء النص

سيتم إخفاء هذا النص

3. التحكم في عرض عناصر الجدول

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

مثال الاستخدام:

الخلية 1

الخلية 2

الخلية 3

  • الخلية 4

    4. خلق الأكورديون

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

    مثال الاستخدام:

    العنوان 1

    المحتويات 1

    العنوان 2

    المحتويات 2

    سؤال وجواب

    لماذا أحتاج إلى استخدام خاصية" عرض بلا"?

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