Flex vs Grid


هذا على حسب استخدامات الموقع، يوجد العديد من ال Layouts التي أعتقد أنها مهما مر الزمن تصبح قديمة و هي تستخدم في العديد من المواقع المشهورة.

  1. Single column : تستخدم غالبًا لصفحات التطبيقات أو المدونات.
  2. Split screen: تستخدم لعرض فكرتين رئيسيتتن للموقع.
  3. Asymmetrical layout: تستخدم إذا أردت عمل تصميم مبدع لصفحة تسجيل حتى لا تجعل شكل الصفحة مملة و هي تعطي انطباع جيد جدًا عن الموقع.
  4. A grid of cards: مثل اليوتيوب
  5. Magazine: مثل الصحف الاليكترونية و المجلات العالمية.

و هنالك العديد من التصميمات الرائعة، و يمكنك الاستفادة من هذا المقال:

مرحبا ياسين،

شكرا لمساهمتك، لكن اتحذث عن layout الخاصة بلغة css وما الخاصية الافضل لانشاء layout احترافي هل استعمل ال flex و ال grid .

إذا أردت عمل Layout بسيط غير معقد يمكنك استخدام Flexbox فهو يعتمد لعمل تخطيطات أحادية البعد.

إذا أردت عمل Layout معقد قليلا من الممكن استخدام Css Grid فهو يعتمد لعمل تخطيطات ثنائية البعد.

Flexbox يسمح للمصممين بوضع العناصر سريعة الاستجابة بشكل مناسب داخل الشاشات ذات الأحجام المختلفة. الأدوات تشمل:

  • تخطيط مربع للمستندات.
  • تخطيط مضمن لتحديد مظهر النص على الشاشات .
  • تخطيط جدول لتصوير البيانات الجدولية في بُعد واحد.
  • وضع تخطيط موضعي يتيح تحديد موضع العناصر المتجاوبة بشكل واضح.

تعمل CSS Grid على محاذاة العناصر في الأعمدة والصفوف ، مما يسمح للمطورين بالتحكم بسهولة في عرض ومظهر التخطيطات الكبيرة والصفحات الكاملة المخصصة لشاشات سطح المكتب والجهاز اللوحي والهاتف الذكي.

شكرا جزيلا لك والله شكرا 💜


تطوير الويب

مجتمع لمناقشة وتبادل الخبرات حول تطوير الويب. ناقش أحدث التقنيات، اللغات، والأدوات في عالم تطوير المواقع والتطبيقات. شارك مشاريعك، اسأل عن نصائح، وتعاون مع مطورين محترفين وهواة.

91 ألف متابع