ツムピロ - 試してみよ＝✨

コードを書いてみよう！✨

エラー: コードに問題があります！

HTML:


CSS:
.box {
    width: 100px;
    height: 100px;
    border: 2px solid #ff69b4;
}

HTML:

こんにちは、ツムピロ！

HTML:
キラキラ✨

CSS:
.colored-text {
    color: #ff69b4;
    text-shadow: 0 0 5px #ff69b4;
}

ツムピロの「試してみよ＝✨」ページへようこそ！ここでは、プログラミング初心者でも簡単にHTML、CSS、JavaScriptを試して、キラキラした結果を見ることができます！以下のステップで使ってみましょう！

プログラムの入力は3つのエリアで！
- HTMLエリア：ウェブページの内容を書きます。例えば、<p>こんにちは！</p> と入力すると、文字が表示されます。
- CSSエリア：デザインを追加します。例えば、p { color: red; } と書くと、文字が赤くなります。
- JavaScriptエリア：動きや機能を追加します。例えば、alert("こんにちは！"); と書くと、ポップアップが表示されます。
「実行する！」ボタンを押す：コードを入力したら、ピンクと水色の「実行する！」ボタンをクリック！結果が下の「実行結果」エリアにキラキラ表示されます！
サンプルコードを試す：右側の「サンプルコード🌟」から、簡単な例（枠、文字、色付き文字）をクリックすると、コードが自動で入力されて実行されます。初心者の方はここから始めるのがおすすめ！
エラーが出たら？：コードに間違いがあると、赤いエラーメッセージが表示されます。メッセージを読んで、コードを直してみましょう！
もっと試したい！：下の「もっとサンプルプログラム！」セクションで、8つの初心者向けプログラムを試せます。「コピー」ボタンを押すと、コードがエディターにセットされます！

さあ、キラキラプログラミングの世界へ！✨ わからないことがあれば、試しながら学んでみてね！

ボタンを押すとメッセージが表示されるよ！

キラキラした丸い形を作ってみよう！

マウスを乗せると文字が光るよ！

グラデーションの背景を追加しよう！

ボタンを押すと数字が増えるよ！

かわいい画像を表示してみよう！

四角がスライドするアニメーション！

名前を入力して挨拶しよう！