習作1 - 完成答案版

✓ 1a 答案

CSS 代碼：

.topping {
  font-size: 28px;
  padding: 4px;
  color: saddlebrown;
  background-color: beige;
}

說明： 使用 class 選擇器選取所有列表項目，應用指定的樣式規則。

✓ 1b 答案

任意兩個 CSS 選擇器（示例）：

#hero
img[src="./brownies.jpeg"]

其他可能的選擇器：

• img （元素選擇器）
• [alt="brownies"] （屬性選擇器）
• body img （後代選擇器）
• img:first-of-type （偽類選擇器）

✓ 2a 答案

toppings[3];

結果： "抹茶淋醬 Matcha Drizzle"

說明： 數組索引從 0 開始，第 4 個元素在索引 3 的位置。

✓ 2b 答案

toppings.push("Oreo");

說明： push() 方法將新元素添加到陣列的尾端。

✓ 2c 答案

for (let i = 0; i < toppings.length; i++) {
  console.log(toppings[i]);
}

其他實現方式：

toppings.forEach(function(topping) {
  console.log(topping);
});

// 或使用箭頭函數
toppings.forEach(topping => console.log(topping));

輸出結果：

核桃 Walnut
焦糖 Caramel
海鹽 Sea Salt
抹茶淋醬 Matcha Drizzle
草莓 Strawberry
Oreo