السحابة 1

الدرس 4 من 18 في دورة سحب متحركة - مشروع HTML/CSS/JS على Coddy.

التحدي

سهل

في ملف HTML، قم بإنشاء div داخل #container مع اسم الفئة "cloud".

في ملف CSS، استهدف div السحابة الجديد وقم بتعيين:

width إلى 200px
height إلى 80px
لون خلفية من اختيارك (تذكر، إنها سحابة!)
border radius بقيمة 40px
position إلى absolute (لأننا نريد التحكم في موضع السحابة بحرية)

أيضًا، قم بتعيين margin إلى 100px أو أكثر حتى تتمكن من رؤية السحابة بالكامل في الدروس القادمة (سنقوم بإزالة هذا الهامش لاحقًا).

جرّب بنفسك

<!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/JS

1مقدمة

4اللعب بـ JS

2الحاوية

5تحريك السحابة

3السحابة

السحابة 1

6سحب كثيرة