مفهوم الخاصية Visibility والخاصية Display في لغة البرمجة CSS

هناك العديد من الخصائص والمزايا الخاصة بكل لغة من لغات البرمجة، ومن بين هذه اللغات لغة البرمجة (CSS) حيث هناك العديد من هذه الخصائص والتي تقوم بتنفيذ مهمات معينة، ومن بين هذه الخصائص الخاصية (Visibility) التي تستخدم للتحكم فيما إذا كان العنصر مرئياً أم لا، وهناك العديد من القيم الخاصة بهذه الخاصية في لغة البرمجة (CSS) وفيما يلي أهمها:



القيمة (visible): وهي القيمة الافتراضية لهذه الخاصية وتعني أن العنصر مرئي للمستخدم.


القيمة (hidden): وتعني هذه القيمة في لغة البرمجة (CSS) أن العنصر مخفي وغير مرئي.


القيمة (collapse): يتم استخدام هذه القيمة عند الرغبة في إزالة الصف أو العمود بالكامل من العرض، حيث تُستخدم هذه القيمة لعناصر الصفوف ومجموعة الصفوف والأعمدة ومجموعة الأعمدة.


القيمة (inherit): تقوم هذه الخاصية بتحديد فيما إذا كانت قيمة الخاصية (visibility) يجب أن يتم اكتسابها من العنصر الأب، أي أنها ترث نفس قيمة الخاصية (visibility) كما هي محددة للعنصر الأب.


القيمة (initial): تقوم هذه الخاصية بضبط وإرجاع القيمة الافتراضية للعنصر (default value).


القيمة (visibility: collapse): تقوم هذه الخاصية بإزالة جميع العناصر الداخلية الموجودة داخل الجدول، لكنها لا تؤثر على تخطيط وشكل الجدول، حيث سيتم تعبئة المساحة التي كانت تشغلها هذه العناصر من قبل العناصر المجاورة لها.


مفهوم الخاصية Display في لغة البرمجة CSS


تستخدم الخاصية (display ) في لغة البرمجة (CSS) للقيام بتحديد نوع صندوق العرض الذي سيتم استخدامه مع العنصر، وهناك مجموعة من القيم التي تستخدم مع هذه الخاصية، وفيما يلي أهمها:



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

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