تطوير موقع ويب باستخدام html,css

بصفتي المطوّر المسؤول عن تنفيذ واجهة الموقع، قمت بإضافة وتنسيق هذه الصور والمحتوى البرمجي داخل الصفحات باستخدام تقنيات HTML وCSS و/أو إطار عمل (مثل React أو Vue أو Flutter Web بحسب السياق).

التفاصيل:

إدراج الصور:

تم رفع الصور واستخدامها في الصفحة باستخدام الوسوم البرمجية المناسبة (<img> في HTML)، مع تخصيص الحجم والمكان داخل التصميم حسب متطلبات التخطيط المرئي (layout).

تنسيق العناوين والوصف:

قمت بكتابة وتنسيق العناوين والنصوص التوضيحية أسفل كل صورة باستخدام عناصر تنسيقية مثل:

html

نسخ

تحرير

<h2>ثلاثة ملاعب جولف</h2>

<p>جلسة رائعة في الهواء الطلق</p>

التصميم والاستجابة:

تم تنسيق الصور والنصوص لتكون متجاوبة (Responsive) مع مختلف الشاشات، وتوزيعها على الصفحة باستخدام Flexbox أو Grid، وضبط الألوان والخطوط لتتناسب مع هوية التصميم.

إضافة النصوص الديناميكية:

في بعض الحالات، تم تحميل النصوص والعناوين من ملف بيانات (JSON أو قاعدة بيانات)، وأضفت المنطق البرمجي لعرضها تلقائيًا بجانب كل صورة.

? مثال على كود قمت باستخدامه:

html

نسخ

تحرير

<div class="gallery-item">

<img src="images/golf1.jpg" alt="ملعب جولف">

<h3>ثلاثة ملاعب جولف</h3>

<p>جلسة رائعة في الهواء الطلق</p>

</div>