隨著互聯網的發展,電子書的閱讀越來越流行,書城成為人們購買或獲取電子書的主要場所之一。在書城中,列表頁是展示書籍的重要頁面,這里我們將以HTML5編寫一個書城列表頁的代碼示例。
<!DOCTYPE html> <html> <head> <title>書城列表頁</title> <meta charset="UTF-8"> </head> <body> <h1>書城列表頁</h1> <ul> <li> <img src="book1.jpg" alt="《人類簡史》封面"> <h2>人類簡史</h2> <p>作者: 尤瓦爾·赫拉利</p> <p>出版社: 中信出版社</p> <p>價格: 39.00元</p> </li> <li> <img src="book2.jpg" alt="《浪潮之巔》封面"> <h2>浪潮之巔</h2> <p>作者: 吳軍</p> <p>出版社: 機械工業出版社</p> <p>價格: 28.00元</p> </li> <li> <img src="book3.jpg" alt="《黑客與畫家》封面"> <h2>黑客與畫家</h2> <p>作者: Paul Graham</p> <p>出版社: 人民郵電出版社</p> <p>價格: 27.00元</p> </li> </ul> </body> </html>
在這個代碼示例中,我們使用了HTML5的標簽來實現書城列表頁的頁面結構。其中,<img>標簽用于顯示書籍封面,<h2>標簽用于顯示書名,<p>標簽用于顯示作者、出版社和價格等信息。<ul>和<li>標簽則用于顯示多本書籍的信息。
此外,我們還在代碼開頭添加了<!DOCTYPE html>聲明和<meta charset="UTF-8">標簽,分別用于定義HTML文檔類型和字符編碼。
通過這個HTML5書城列表頁的代碼示例,我們可以看到HTML5標簽的靈活運用和編寫網頁的基本結構和常用標簽的實現。希望能對您的學習和實踐有所幫助。