CSS responsive grid container حاوية grid مع الصفحات المتجاوبة في لغة CSS

سوف تتعلم في هذا الدرس نظام grid view مع وعلاقتة بصفحات الويب المتجاوبة ولماذا هو يعد من أفضل الأنظمة لعمل صفحات متجاوبة في لغة CSS.

1 صفوف تعليمية

لغة CSS

3,649 مشاهدة

شرح صفوف ومحتوى الفقرة

الصف 1 شرح توضيحي

نبدأ في تجهيز صفحة حاوية كبيرة يطبق عليها display:grid بلغة CSS داخل صفحة الويب التي قمنا بتجهيزها.

إنشاء حاوية grid مع بعض الخصائص في CSS.

HTML

.grid-container
{
  height: 320px;
  display:grid;
  width:100%;
  background-color: #2196F3;
  padding: 10px;
}