Bulut III

Coddy'nin Hareketli Bulutlar - HTML/CSS/JS Projesi kursunda ders 6 / 18.

Görev

Kolay

HTML dosyasında, bulut div'inin (.cloud, bir tane daha!) içinde "cloudBubble2" sınıf adına sahip bir div oluşturun.

CSS dosyasında, yeni div'i hedefleyin ve şunları ayarlayın:

width değerini 60px yapın
height değerini 60px yapın
arka plan rengini (background color) bulut div'i ile aynı yapın
kenarlık yarıçapını (border radius) 30px yapın
position değerini absolute yapın
top değerini -30px yapın
right değerini 30px yapın

Son olarak, .cloud div'inden margin değerini kaldırın.

Kendin dene

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

Hareketli Bulutlar - HTML/CSS/JS Projesi bölümündeki tüm dersler

1Giriş

4JS ile Oynamak

2Kapsayıcı

5Bulutu Hareket Ettirme

Her Şeyi Rastgele Yap

3Bulut

Bulut I

Bulut II

Bulut III

6Çok Sayıda Bulut

JS kullanarak HTML Enjekte Etme

Bulutları Enjekte Etme

Tümünü Döngüye Alma

Son Dokunuş