مشاركة حلول: مهمة تطبيق فيتامين واو


#43

فيتامين واو

<!DOCTYPE html>
<html>
<head>
  <meta charset="UTF-8">
  <title>فيتامين واو</title>
</head>
<body>
  <header>
    <h1>فيتامين واو</h1>
  </header>
  <main>
    <h2>سنجعلك في المقدمة إن تأخرت</h2>
    <p>إحتياجك لهذا الفيتامين أكثر من الفيتامينات الآخرى فهو الفيتامين الذي لا يمد جسدك بالقوة فحسب ولكن يفيدك من الناحية الوظيفية ويوسع حجم معارفك.</p>
    <div>
      <img src="https://raw.githubusercontent.com/coretabs-academy/frontend-basics-workshop-markdown/master/project-structure/task/assets/banner.jpg">
    </div>
    <a href="#">اطلب وساطة</a>
  </main>
  <footer>
    <p>&copy; 2018 جميع الحقوق محفوظة لفيتامين واو</p>
  </footer>

</body>
</html>

#44

عمل ممتاز :clap:


#46

تدريب فيتامين واو :v:

<html>
    <head>
        <meta charset="utf-8">
        <title>فيتامين واو</title>
    </head>
    
    <body>
        <header>
            <h1>فيتامين واو</h1>
        </header>
        <main>
            <h2>سنجعلك في المقدمة إن تأخرت</h2>
                    <p>إحتياجك لهذا الفيتامين أكثر من الفيتامينات الآخرى فهو الفيتامين الذي لا يمد جسدك بالقوة فحسب ولكن يفيدك من الناحية الوظيفية ويوسع حجم معارفك.</p>
            <img src="https://raw.githubusercontent.com/coretabs-academy/frontend-basics-workshop-markdown/master/project-structure/task/assets/banner.jpg">
            <div>
            <a href="#">اطلب وساطة</a>
            </div>
        </main>
        <footer>
            <p> &copy 2018 جميع الحقوق محفوظة لفيتامين واو</p>
        </footer>
    </body>
</html>

#47

جميل ي عمر :star_struck::muscle:

ملاحظة: في كود واحد ناقص اكتشف وين :wink:


#48

لم أعرف بعد كيفية الكتابة باللغة العربية في محرر النصوص لتظهر على الصفحة
هذا الكود الخاص بي

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title> Vitmine WOW </title>
</head>
<body>
	<header>
		<h1>VIT O</h1>
	</header>
	<main>
		<h2> we will make you at the head if you are late</h2>
		<p>
			you need this Vit more than any other Vit. beacause, it not only provides your body with power but also your future career.
		</p>
		<div>
			<img src="https://raw.githubusercontent.com/coretabs-academy/frontend-basics-workshop-markdown/master/project-structure/task/assets/banner.jpg">
		</div>
		<a href="https://www.youtube.com/"> make an order now </a>
	</main>
	<footer>
		<p>
			&copy; 2018 all rights reserved
		</p>
	</footer>
</body>
</html>

#49

عمل مضبوط مية مية :smiley:

ماهي المشكلة الي بتواجهك عند كتابة المحتوى بالعربية؟


#50

تقصد هذا السطر :thinking:

<!DOCTYPE html>

#51

ايوة، هذا السطر يعرف المتصفح باصدار لغة ال HTML والذي هو 5 في حالتنا :+1:


#52
<!DOCTYPE html>
<html>
    <head>
    <meta charset="utf-8">
    <title>فيتامين واو </title>
    <style>
        body {
           background-color:#171a29;
           color:#ffffff;
        }
        header{
             background-color:#212639;
             width:100%;
             height:60px;
        }
        main img{
            width:600px;
            height:210px;
        }
        main a{
            background-color:#3b7c3a;
            color:#ffffff;
        }
        footer p{
            background-color:#0f121b;
            color:#707281;
            width:100%;
            height:40px;
        }
    </style>
    </head>
    <body>
    <header>
        <h1> فيتامين واو </h1>
    </header>
    <main>
        <h2>سنجعلك في المقدمة إن تأخرت</h2>
        <p>إحتياجك لهذا الفيتامين أكثر من الفيتامينات الآخرى فهو الفيتامين الذي لا يمد جسدك بالقوة فحسب ولكن يفيدك من الناحية الوظيفية ويوسع حجم معارفك.</p>
        <img src="https://raw.githubusercontent.com/coretabs-academy/frontend-basics-workshop-markdown/master/project-structure/task/assets/banner.jpg">
    <a href="#">أطلب وساطة</a>
    </main>
    <footer>
        <p>&copy; جميع الحقوق محفوظة لفيتامين واو 2018</p>
    </footer>
    </body>
</html>

#53

جميل كما هو مطلوب :muscle:


#54

لا يتعرف محرر النصوص لذي استخدمه على الاحرف لعربية
أستخدم sublime text3


#55

مهمة: التدرب على تقسيم وهيكلة الصفحات
الكود: :grinning::grinning:

<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>فيتامين واو</title>
</head>
<body>
	<header>
		<h1>فيتامين واو</h1>
	</header>
	<main>
		<div>
			<h2>سنجعلك في المقدمة إن تأخرت</h2>
			<p>إحتياجك لهذا الفيتامين أكثر من الفيتامينات الآخرى فهو الفيتامين الذي لا يمد جسدك بالقوة فحسب ولكن يفيدك من الناحية الوظيفية ويوسع حجم معارفك.</p>
			<img src="https://raw.githubusercontent.com/coretabs-academy/frontend-basics-workshop-markdown/master/project-structure/task/assets/banner.jpg">
		</div>
		<a href="#">اطلب وساطة</a>
	</main>
	<footer>
		<p>&copy; 2018 جميع الحقوق محفوظة لفيتامين واو</p>
	</footer>
</body>
</html>

شكرا :grinning:


#56

مع الأسف مشكلة واجهتني سابقاً وبالرغم من وجود اضافة تساعدك على حل المشكلة الا انها تضل مزعجة.

أنصح بالإنتقال إلى VS Code او Atom


#57

:white_check_mark: مية مية :+1:


#58

شكرا لك استاذ
عندي سؤال هل هذه نهاية هذا المساق مستوى مبتدى
ام هناك فيديوات لاحقة
وايضا هل يحق لي الالتحاق باكثر من مسار ضمن الاكاديمية اذا نعم فالالتحاق كيف يتم ارجو التوضيح
وشكرا


#59

لا شكر على واجب :blush:

عندي سؤال هل هذه نهاية هذا المساق مستوى مبتدى

لا، مازال لدينا وحدتين ونكمل العمل على الورشة الأولى.

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

وايضا هل يحق لي الالتحاق باكثر من مسار ضمن الاكاديمية اذا نعم فالالتحاق كيف يتم ارجو التوضيح

نعم تستطيعي التغيير بين المسارات من خلال لوحة التحكم

بالضغط على الصورة الشخصية > إعدادات الحساب > تغيير المسار


#60
فيتامين واو

فيتامين واو

<section>
	<article>
		<p>سنجعلك في المقدمة إن تأخرت</p>

		<p>إحتياجك لهذا الفيتامين أكثر من الفيتامينات الآخرى فهو الفيتامين الذي لا يمد جسدك بالقوة فحسب ولكن يفيدك من الناحية الوظيفية ويوسع حجم معارفك.</p>

		<div>
			<img src="https://raw.githubusercontent.com/coretabs-academy/frontend-basics-workshop-markdown/master/project-structure/task/assets/banner.jpg" alt="man">
		</div>

		<button>أطلب وساطة</button>
	</article>
</section>

<footer>
	<p>جميع حقوق الطبع محفوظة فيتامين واو 2018</p>
</footer>

#61

الحمد لله الذي بنعمته تتم الصالحات :smiley:

<html>
    <head>
        <meta charset="utf-8">
        <title>فيتامين واو</title>
    </head>
    <body>
        <header>
        <h1>فيتامين واو</h1>
        </header>
        <main>
            <h2>سنجعلك في المقدمة إن تأخرت</h2>
            <p>إحتياجك لهذا الفيتامين أكثر من الفيتامينات الآخرى فهو الفيتامين الذي لا يمد جسدك بالقوة فحسب ولكن يفيدك من الناحية الوظيفية ويوسع حجم معارفك.</p>
            <div>
                <img src="https://raw.githubusercontent.com/coretabs-academy/frontend-basics-workshop-markdown/master/project-structure/task/assets/banner.jpg" width="500" height="200">
            </div>
            <a href="www.vitamino.com">اطلب وساطة</a>
        </main> 
        <footer>
            <p>&copy; 2018جميع الحقوق محفوظة لفيتامين واو</p>
        </footer>  
    </body>
</html>


#62

ممتاز كل شئ حسب المطلوب :grin::clap:


#63

قم بكتابة بقية الوسوم بالإضافة إلى إضافة العنصر header :blush: