وسم body

الدرس 6 من 10 في دورة رسوم متحركة لكسوف الشمس | مشروع HTML/CSS على Coddy.

التحدي

سهل

في ملف CSS، استهدف وسم body:

قم بضبط display على flex، و align-items، و justify-content على center.
قم بضبط height على 600px.
قم بضبط background-image على linear-gradient(30deg, #182C51, #09101e).
قم بضبط overflow على hidden.

جرّب بنفسك

<!DOCTYPE html>
<html>
<head>
    <link rel="stylesheet" href="styles.css">
</head>
    <body>
        <!-- Write HTML code here -->
        <script src="script.js"></script>
    </body>
</html>

جميع دروس رسوم متحركة لكسوف الشمس | مشروع HTML/CSS

1HTML

ماذا ستصنع؟إعداد الكود حاوية القمر

2CSS

الوسم العام

وسم html

وسم body

فئة moon

العنصر الزائف لفئة moon

أنيميشن الكسوف

التجاوب

تدرّب بنفسك: Playground لـ Web