第一個HTML頁面 · 教案-標準教案-開發類預科(v1)

## 第一個HTML頁面 [TOC] 在上一節中，我們寫了第一個相對完整的HTML頁面。現在，我們接到一個緊急的開發任務，為CODING COFFEE咖啡館開發一個咖啡菜單頁。 ```html <!DOCTYPE html> <html> <head> <title>Starbuzz Coffee</title> <style> body { background-color: #d2b48c; margin-left: 20%; margin-right: 20%; border: 2px dotted black; padding: 10px 10px 10px 10px; font-family: sans-serif; } </style> </head> <body> <h1>Starbuzz Coffee Beverages</h1> <h2>House Blend, $1.49</h2> <p>A smooth, mild blend of coffees from Mexico, Bolivia and Guatemala.</p> <h2>Mocha Caffe Latte, $2.35</h2> <p>Espresso, steamed milk and chocolate syrup.</p> <h2>Cappuccino, $1.89</h2> <p>A mixture of espresso, steamed milk and milk foam.</p> <h2>Chai Tea, $1.85</h2> <p>A spicy drink made with black tea, spices, milk and honey.</p> </body> </html> ``` `<!DOCTYPE>`不是 HTML 標簽。它為瀏覽器提供一項信息（聲明），即 HTML 是用什么版本編寫的。 `<html>`中的內容描述網頁。 `<body>`中的內容是可見的頁面內容。 `<head>`中的內容描述網頁頭信息。 `<title>`中的文本顯示為網頁的標題。 `<h1>`中的文本是正文一級標題。 `<p>`中的文本為網頁中的段落。 `<a>`標簽為網頁中的超鏈接。 ## 作業 * 完成CODING COFFEE菜單頁