クラウド III

Coddyの「流れる雲 - HTML/CSS/JSプロジェクト」コースのレッスン 6/18。

チャレンジ

簡単

HTMLファイルで、cloud div（.cloud、もう一つです！）の中に、クラス名が "cloudBubble2" の div を作成してください。

CSSファイルで、新しいdivをターゲットにして以下を設定してください：

width を 60px に
height を 60px に
背景色（background color）をcloud divと同じものに
border radius を 30px に
position を absolute に
top を -30px に
right を 30px に

最後に、.cloud divから margin を削除してください。

自分で試してみよう

<!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はじめに

4JSで遊ぼう

2コンテナ

5雲を動かす

3クラウド

クラウド III

6たくさんの雲