مفهوم تخطيط Grid في لغة البرمجة CSS وما هي أهم الخاصيات التي تستخدم معه
خاصية تخطيط (Grid) في لغة البرمجة (CSS) هي عبارة عن نظام تخطيط قائم على الشبكة والذي يحتوي على مجموعة من الصفوف والأعمدة، وهذا يسهل عملية تصميم صفحات الويب بكل سهولة ويسر، وهناك مجموعة من الخاصيات الخاصة بهذا المفهوم وفيما يلي أهمها:
| الخاصية | الاستخدام |
| grid | الخاصية (grid) في لغة البرمجة (CSS) تقوم بضبط جميع الخاصيات التي تُحدَد خصائص الجداول والأعمدة بلغة البرمجة (CSS) بوضوح والتي تسمى (grid-template-rows) و (grid-template-columns) وgrid-template-areas)، وجميع الخاصيات التي تُحدِّد خصائص الجداول مثل: (grid-auto-columns و grid-auto-flow)، والخاصيات التي تُحدد حجم الفراغ بين الأعمدة والأسطر. |
| grid -auto -columns | تقوم بتحديد أبعاد المسافات بين الأعمدة التي يتم انشاؤها بشكل ضمني. |
| grid-auto-rows | تضبط أبعاد المسافات بين السطور التي يتم انشاؤها بشكل ضمني. |
| grid -column | الخاصية (grid-column) هي التي تحدِّد أبعاد عنصر (grid) ومكانه في العمود في لغة البرمجة (CSS) وهي عبارة عن خاصية مختصرة تضبط قيمة الخاصيتين (grid-column-start) و (grid-column-end) التي تُحدِّد أبعاد نقطة البداية والنهاية. |
| grid – column -end | حيث تستعمل لضبط مكان نهاية العنصر الخاص ب (grid) ضمن عمود معين ثم تحديد رقم العمود أو الامتداد أو جعل موضع العنصر تلقائي. |
| grid -column -start | تستعمل هذه الدالة لضبط مكان بداية عنصر (grid) ضمن عمود معين ثم تقوم بتحديد رقم العمود أو الامتداد. |
| grid -gap | الخاصية (grid-gap) في لغة (CSS) هي خاصية تختص بضبط قيمة الخاصيتين (grid -row- gap) و (grid -column -gap)، وهي المسؤولة عن تحديد المسافة التي تفصل بين الأسطر والأعمدة. |
| grid-row | الخاصية (grid-row) في لغة (CSS) هي خاصية مختصرة تضبط قيمة الخاصيتين (grid-row-start) و (grid-row-end) الخاصة في السطر. |
| grid -row -end | تستعمل هذه الخاصية لضبط مكان نهاية العنصر ضمن سطر معين حيث تقوم بتحديد السطر أو الامتداد أو جعل موضع العنصر تلقائي. |
| grid-template | الخاصية (grid-template) في (CSS) هي خاصية مختصرة تستعمل لضبط قيم للخاصيات التالية: (grid -template -rows) و (grid -template -columns) و (grid-template-areas). |
| grid-template-columns | تستخدم هذه الدالة لضبط أسماء وأبعاد المسافات بين الأعمدة. |
