HTML5點餐網頁代碼是一種全新的網頁設計語言,可以幫助餐廳提高訂單的處理速度,更好地服務顧客。下面是一段使用HTML5編寫的點餐網頁代碼。
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>點餐頁面</title> <style> /* CSS代碼,呈現頁面的樣式 */ body { font-family: Arial, sans-serif; } h1, h2, h3 { text-align: center; } .menu-item { display: inline-block; border: 1px solid black; margin: 10px; padding: 10px; width: 200px; } </style> </head> <body> <h1>歡迎光臨我們的餐廳!</h1> <h2>請從以下菜單中選擇你喜歡的菜品</h2> <div class="menu-item"> <h3>酸辣土豆絲</h3> <p>價格:15元</p> <p>描述:口感酸香,辣度適中,配合清淡的米飯吃更佳。</p> <button>添加至購物車</button> </div> <div class="menu-item"> <h3>宮保雞丁</h3> <p>價格:20元</p> <p>描述:口感香醇,微辣可口,是大眾喜愛的經典菜品。</p> <button>添加至購物車</button> </div> <div class="menu-item"> <h3>紅燒肉</h3> <p>價格:25元</p> <p>描述:外酥里嫩,色香味俱佳,是家常菜系中的優秀代表。</p> <button>添加至購物車</button> </div> </body> </html>
以上代碼使用了HTML5的語法,其中<!DOCTYPE html>聲明了文檔類型,<meta>設置了字符編碼和頁面標題,<style>標簽中定義了CSS樣式,<h1>、<h2>、<h3>標簽定義了標題,<div>和<p>標簽定義了網頁內容。此外,還使用了按鈕標簽<button>實現添加菜品至購物車的功能。
上一篇html5照片背景墻代碼
下一篇html5點贊效果代碼