CSSの演習問題を、DOMの内容に合うように修正 (#2)

nakaterm · web-flow · commit e666e7387596 · 2024-06-02T21:40:47.000+09:00
diff --git a/docs/02-css/_samples/hello-css/index.html b/docs/02-css/_samples/hello-css/index.html
@@ -6,6 +6,6 @@
     <title>タイトル</title>
   </head>
   <body>
-    <p id="greeting">Hello CSS!</p>
+    <p id="greeting">こんにちは、CSS！</p>
   </body>
 </html>
diff --git a/docs/02-css/_samples/hello-css/style.css b/docs/02-css/_samples/hello-css/style.css
@@ -1,4 +1,5 @@
 #greeting {
   color: green;
+  background-color: lightgray;
   font-size: 40px;
 }
diff --git a/docs/02-css/hello-css.jpg b/docs/02-css/hello-css.jpg
diff --git a/docs/02-css/index.mdx b/docs/02-css/index.mdx
@@ -100,7 +100,9 @@ CSS の<Term type="cssProperty">プロパティ</Term>には `color` (文字色)
 
 ### 問題 1
 
-次のように、画面に `こんにちは、CSS！` と表示して、文字色を緑色、文字サイズを `40px` にしてください。
+次のように、画面に `こんにちは、CSS！` と表示して、文字色を `green` に、背景色を `lightgray` に、文字サイズを `40px` にしてください。
+
+![こんにちは、CSS！](./hello-css.jpg)
 
 <Answer title="こんにちは、CSS！">
 
@@ -112,14 +114,15 @@ CSS の<Term type="cssProperty">プロパティ</Term>には `color` (文字色)
     <title>タイトル</title>
   </head>
   <body>
-    <p id="greeting">Hello CSS!</p>
+    <p id="greeting">こんにちは、CSS！</p>
   </body>
 </html>
 ```
 
 ```css
 #greeting {
   color: green;
+  background-color: lightgray;
   font-size: 40px;
 }
 ```

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,5 @@`
`1`	`1`	`#greeting {`
`2`	`2`	`color: green;`
	`3`	`+ background-color: lightgray;`
`3`	`4`	`font-size: 40px;`
`4`	`5`	`}`