CSS Grid Column End
خاصية grid-column-end في لغة CSS
سوف تتعلم في هذا الدرس خاصية grid-column-end في لغة CSS ووظيفيتها وكيفية استخدامها مع عناصر حاوية Grid وجميع القيم الخاصة بها.
التاريخ
الدروس
المستوى
اللغة
المشاهدات
المواضيع
CSS Grid Column End
خاصية grid-column-end في لغة CSS
</>
CSS Grid Column End
خاصية grid-column-end في لغة CSS
تستخدم خاصية grid-column-end مع العناصر الداخلية لحاوية grid في لغة CSS لينتهي عرض العنصر في موضع معين يبدا بناء علي خاصية grid-column-start من خط أو من عمود معين وينتهي عرضة بناء علي قيمة خاصية grid-column-end.
قيم خاصية grid-column-end في لغة CSS:
- auto هي القيمة الأفتراضية ويتم إنتهاء عرض العناصر تلقائياً وفقاً لوضعة داخل حاوية grid.
- span تحديد عدد الأعمدة أو عدد المربعات التي سوف يقوم بحجزها العنصر نسبة لحجم الأعمدة الأخري وينتهي عند عمود أو خلية معينه.
- column-line تحديد انتهاء عرض العنصر يلنتهي عند رقم line الخط الموجود بعد كل عمود.
CSS grid-column-end syntax
طريقة كتابة خاصية grid-column-end في لغة CSS.
grid-column-end:value;
CSS grid-column-end values
قيم خاصية grid-column-end في لغة CSS.
grid-column-end:auto|span|column-line;
</>
CSS grid column start auto
خاصية grid-column-start مع القيمة auto في لغة CSS
CSS grid column end auto
خاصية grid-column-end مع القيمة auto في لغة CSS.
.one { grid-column-start:auto; grid-column-end:auto; }
</>
CSS grid column end span
خاصية grid-column-end مع القيمة span في لغة CSS
CSS grid column end span
خاصية grid-column-end مع القيمة span في لغة CSS.
.one { grid-column-end:span 4; }
CSS grid column end span two
خاصية grid-column-end مع القيمة span 2 في لغة CSS.
.one { grid-column-end:span 2; }
</>
CSS grid column end column line
خاصية grid-column-end مع القيمة column line في لغة CSS
CSS grid column end column line
خاصية grid-column-end مع القيمة column line في لغة CSS.
.one { grid-column-start:2; grid-column-end:5; }
CSS grid column end line four
خاصية grid-column-end مع القيمة four في لغة CSS.
.one { grid-column-start:1; grid-column-end:4; }