كيفية تصميم Single Price Grid Component In HTML & CSS

#دروس_برمجة #html #css #frontend_mentor #frontend

================================================

اسم المشروع😎:
Single price grid component || Frontend Mentor Challenge

المميزات😋:
In this challenge, you will build out the pricing component to the designs provided. This is perfect for beginners and people who want to complete a smaller challenge.

View the optimal layout for the component depending on their device's screen size
See a hover state on desktop for the Sign-Up call-to-action

رابط التحدي علي موقع Frontend Mentor👏:
https://www.frontendmentor.io/challen...

رابط المشروع اونلاين✈:
https://mohamedcleancode.github.io/Si...

رابط السورس كود(ممكن تديني نجمة ⭐):
https://github.com/mohamedCleanCode/S...

================================================

دروس برمجة - كيفية عمل تحدي من موقع frontend mentor وتصميم الموقع وتحويله ل code وجعل الموقع متجاوب تماما مع جميع الشاشات ب responsive web design باستخدام ال media query & في التطبيق ده هنعمل شكل يحمل العديد من التفاصيل لذلك سيكون الدرس مليء ب عناصر ال html و خصائص ال css لجعلك تحترف انشاء وتصميم المواقع بطريقه احترافيه

================================================

00:00 : المقدمة
00:15 : اي المشروع ال هنعمله
00:25 : شرح تحميل الصور والملفات من موقع frontend mentor
01:15 : تهيئة بيئة العمل علي vs code
06:55 : كتابة code html
12:16 : كتابة code css
29:50 : كيفية عمل التصميم متجاوب علي جميع الشاشات
41:00 : اضافة اشياء مهمه في ال readme file لعرض المشروع بشكل جميل علي ال github
42:15 : النهاية

================================================

تقدر تتابعني او تتواصل معايا من خلال الروابط دي🙏😎:
Facebook : https://www.facebook.com/profile.php?...
Linkedin :   / mohamed-mostafa-55526a221  
My Website : https://mohamed-mostafa-gallery.netli...
Github : https://github.com/mohamedCleanCode

================================================

#حل_تكليفات_الزيرو
#حل_تكليفات_الزيرو_html
#حل_تكليفات_الزيرو_css
#حل_تكليفات_الزيرو_javascript
#حل تكليفات_الزيرو_++c
#مشاريع_frontend_mentor
#frontend_mentor
#مشاريع_front_end
#front_end_mentor_challenges
#مشاريع_html_css
#مشاريع_html_css_javascript
#مشاريع_html_css_جاهزة
#html_css_projects
#مشاريع_html_وcss_للمبتدئين
#مشاريع_html_css_للزيرو
#تحديات_frontend_mentor
#النطبيق_علي_html_css_javascript
#مشاريع_فرونت_اند_html_css
#مشاريع_فرونت_اند_html_css_javascript
#مشاريع_front_end
#front_end_mentor_challenges

================================================

تصميم html css, تصميم موقع ويب كامل html css للمبتدئين, تصميم موقع الكتروني html css, تصميم متجر الكتروني html css, تصميم موقع كامل html css js, تصميم موقع html css javascript, design html css - تصميم رائع للويب, تصميم متجر الكتروني html css js, تصميم موقع تجاري html css, تصميم موقع الكتروني html css js, تصميم صفحة هبوط html css, تصميم موقع ويب html css, تصميم موقع افلام html css, تصميم موقع كامل html css, تصميم html css beginners, web design trends, web design tips, web design ideas, webdesign and, web design and development full course, web design and development, web design and web , web design and html hsc, web design development frontend mentor, frontend mentor challenges, frontend mentor , frontend mentor newbie challenges, frontend mentor product preview card component, frontend mentor interactive rating component, frontend mentor news homepage, frontend mentor review, frontend solution, frontend mentor ecommerce product page frontend,front-end,frontend developer,frontend developer roadmap,junior web,dark web in hindi html,css,html and css,html css project,مشاريع بلغة html,html css,بناء موقع html css,html css projects,مشاريع html css,تصميم موقع html css,html css javascript projects for resume,html css website,مشاريع html,html css javascript projects for beginners,html css javascript projects with source code,html css مشروع,تعلم html,مشاريع css,مشاريع برمجية,تعلم css,تصميم موقع ويب كامل html css,html css javascript project,html css javascript projects frontend,front-end,مشاريع برمجة,frontend developer,frontend project ideas,مشاريع,frontend projects,مشاريع برمجية,frontend web development,انشاء مشروع front end,frontend course,master frontend,frontend roadmap,practice frontend,frontend portfolio,مشاريع css,backend and frontend,مشاريع html,مشاريع تخرج,frontend development,المشاريع,كيف يتواصل backend مع frontend,افكار مشاريع ب,frontend developer course,مشاريع html csssingle price grid component,css grid,single price grid component design,single price grid component solution,tsbsankara single price grid component,price grid component design,single price grid,single price grid frontend mentor,frontend mentor single price grid,grid,grid component,single page component,interactive pricing component,price grid,price grid design,1 kw on grid solar system price,1kw on grid solar system price in india