طريقة تصميم موقع شخصي بسيط

السلام عليكم و رحمة الله و بركاته
مرحبا ، اليوم سنصمم موقع شخصي نسنتطيع من خلاله وضع سيرة ذاتية لنا و بعض الروابط

النتيجة النهائية التي سنخرج بها 

نبدأ على بركة الله

نفتح برنامج  ++notepad كالمعتاد ثم نفتح عمل جديد ، نغير اللغة الى html و الذي لا يعرف كيف يفعل ذلك يرجع الى بداية هذا الدرس كيف تصمم صفحة تسجيل دخول بـاستخدام html و css

سيكون مخطط الموقع الذي سنصممه بهذا الشكل

اظن أنكم فهمتم الفكرة الان ، لعمل هذا الموقع نحتاج لتقسيمه الى قسمين ، قسم يمين نضع به الصورة و الروابط
و قسم يسار نضع به النص ، لذا سنحتاج الى aside نضعه الى اليمين و section نضعه الى اليسار و في aside اليمين سنضع به section يحتوى على الصورة و آخر يحتوى على الروابط التي سنضعها بدورها في وسم ul ، لذا يجب ان تُبَرمج الصفحة بهذا الشكل

طبعا يمكنك تغيير نص عنصر <a> من كملة " رابط " الى النص الذي تريده مثلا " الصفحة الرئيسية " او " راسلنا "

كذلك لجعل الرابط مثلا يأخذ الى جوجل او اي موقع او صفحة اخرى اكتب مكان رمز الهاش " # " عنوان الـ url الخاص باي صفحة او موقع تريد ان يذه اليه الزائر على سبيل المثال اكتب " https://www.google.com " و عند الضغط على الرابط من طرف الزائر سياخذه مباشرة الى google .

الان سنكتب الـ css الخاص بالصفحة و سيكون بهذا الشكل 

في السطر رقم 25 ضع عنوان الصورة التي تريد .

يتبع ...

احفظ العمل ثم افتحه على المتصفح و النتيجة

لمن لا يعرف كيفية حفظ الصفحة يعود الى الدرس كيف تصمم صفحة تسجيل دخول بـاستخدام html و css في آخره سيجد الطريقة كذلك من ظهرت له مشكلة الرموز الغريبة او مشكلة الكتابة من اليسار الى اليمين يعود الى ذات الدرس " كيف تصمم صفحة تسجيل دخول بـاستخدام html و css " و سيجد به الحل .

أي استفسار اطرحه بالتعليقات .

سلام  ^^