31 lines
1.1 KiB
Markdown
31 lines
1.1 KiB
Markdown
|
---
|
|||
|
|
title: Create Grids within Grids
|
|||
|
|
localeTitle: إنشاء شبكات داخل شبكات
|
|||
|
|
---
|
|||
|
|
## إنشاء شبكات داخل شبكات
|
|||
|
|
|
|||
|
|
يتم إجراء شبكة داخل الشبكة مثل أي شبكة أخرى.
|
|||
|
|
|
|||
|
|
1. فقط عش عنصر واحد داخل آخر ،
|
|||
|
|
2. وضعهم على _حد سواء_ على الشبكات ،
|
|||
|
|
3. و _POOF_ ! لديك شبكة داخل شبكة.
|
|||
|
|
|
|||
|
|
### تداخل عنصر
|
|||
|
|
|
|||
|
|
بالنسبة لأية مراوح ، فإن تداخل عنصر يبدو كالتالي: \`
|
|||
|
|
|
|||
|
|
هنا شبكتك
|
|||
|
|
|
|||
|
|
هنا شبكتك المتداخلة
|
|||
|
|
|
|||
|
|
\`
|
|||
|
|
|
|||
|
|
### ضبط العناصر الخاصة بك على الشبكات
|
|||
|
|
|
|||
|
|
بعد ذلك ، اضبط خصائص CSS التالية: \`.gridElement { / \* هذا يمنحك شبكة \* / عرض: الشبكة ؛ }
|
|||
|
|
|
|||
|
|
.nestedGridElement { / \* يمنحك ذلك شبكة NESTED \* / عرض: الشبكة ؛ } \`
|
|||
|
|
|
|||
|
|
### معلومة اضافية
|
|||
|
|
|
|||
|
|
بعد ذلك ، لا تتردد في تخصيص الشبكات الخاصة بك كيفما تشاء. أي `grid-template-columns: auto 1fr;` قد تبدو جيدة في تلك الشبكة المتداخلة.
|