تكليفات الدروس من [ 57 ] إلى [ 64 ]
[ 5 ] تكليفات على [ Grid ]
التكليف 01
<div class="grid">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>.grid {
background-color: #ddd;
padding: 20px;
width: 800px;
height: 400px;
}- إستخدم البنية السابقة بدون التعديل عليها لعمل الشكل المطلوب
- تنسيقات ال CSS لتوضيح أبعاد العنصر الأب
- قم بتوسيط العنصر في الصفحة بطريقة عرضية
- قم بعمل الشكل بنفس الالوان
- إستخدم ال Grid لعمل الشكل الأساسي
- يمكنك توسيط النص داخل العنصر باي طريقة تعجبك
- يجب كتابة الكلمات الموجودة داخل العنصر بواسطة ال CSS
التكليف 02
<div class="layout">
<header></header>
<section></section>
<aside></aside>
<footer></footer>
</div>- إستخدم البنية السابقة بدون التعديل عليها لعمل الشكل المطلوب
- قم بعمل الشكل بنفس الالوان
- إستخدم ال Grid لعمل الشكل الأساسي
- يجب كتابة الكلمات الموجودة داخل العنصر بواسطة ال CSS
- يجب عليك أن تملا الصفحة بالتصميم ليكون Full Screen
التكليف 03
<div class="grid">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
<div>5</div>
<div>6</div>
<div>7</div>
<div>8</div>
</div>.grid {
background-color: #ddd;
padding: 20px;
width: 800px;
height: 400px;
}- إستخدم البنية السابقة بدون التعديل عليها لعمل الشكل المطلوب
- تنسيقات ال CSS لتوضيح أبعاد العنصر الأب
- قم بتوسيط العنصر في الصفحة بطريقة عرضية
- قم بعمل الشكل بنفس الالوان
- إستخدم ال Grid لعمل الشكل الأساسي
التكليف 04
<div class="grid">
<div class="one">1</div>
<div class="two">2</div>
<div class="three">3</div>
<div class="four">4</div>
<div class="five">5</div>
<div class="six">6</div>
<div class="seven">7</div>
<div class="eight">8</div>
</div>.grid {
background-color: #ddd;
padding: 20px;
width: 800px;
height: 400px;
}- إستخدم البنية السابقة بدون التعديل عليها لعمل الشكل المطلوب
- تنسيقات ال CSS لتوضيح أبعاد العنصر الأب
- قم بتوسيط العنصر في الصفحة بطريقة عرضية
- قم بعمل الشكل بنفس الالوان
- إستخدم ال Grid لعمل الشكل الأساسي
التكليف 05
<div class="grid">
<div>1</div>
<div>2</div>
<div>3</div>
<div>4</div>
</div>.grid {
background-color: #ddd;
padding: 20px;
width: 800px;
height: 400px;
}- إستخدم البنية السابقة بدون التعديل عليها لعمل الشكل المطلوب
- تنسيقات ال CSS لتوضيح أبعاد العنصر الأب
- قم بتوسيط العنصر في الصفحة بطريقة عرضية
- قم بعمل الشكل بنفس الالوان
- إستخدم ال Grid لعمل الشكل الأساسي
ملحوظة
هناك بعض التحديات في قسم تحديات ال Front-End لا تنسى متابعتها