HTML5天天生鮮代碼是一個基于HTML5技術開發的生鮮商城網站。其網站代碼主要包括HTML、CSS、JavaScript、以及后端語言如PHP等。以下是HTML5天天生鮮代碼中的html部分示例:
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>HTML5天天生鮮代碼</title> <link rel="stylesheet" href="style.css"> <script src="script.js"></script> </head> <body> <header> <div class="logo"> <img src="logo.png" alt="天天生鮮"> </div> <nav> <ul> <li><a href="#">首頁</a></li> <li><a href="#">水果</a></li> <li><a href="#">蔬菜</a></li> <li><a href="#">肉類</a></li> <li><a href="#">海鮮</a></li> </ul> </nav> </header> <main> <section class="banner"> <img src="banner.png" alt="搶鮮水果"> </section> <section class="hot-products"> <h2>熱門商品</h2> <ul> <li> <img src="product1.png" alt="草莓"> <h3>草莓</h3> <p>¥15.99</p> </li> <li> <img src="product2.png" alt="葡萄"> <h3>葡萄</h3> <p>¥12.99</p> </li> <li> <img src="product3.png" alt="西紅柿"> <h3>西紅柿</h3> <p>¥5.99</p> </li> <li> <img src="product4.png" alt="三文魚"> <h3>三文魚</h3> <p>¥60.99</p> </li> </ul> </section> </main> <footer> <p>版權所有 ? HTML5天天生鮮代碼</p> </footer> </body> </html>
在代碼中,doctype聲明為HTML5,并設置了頁面的標題與編碼。在頭部通過link標簽引入了樣式表,以及script標簽引入了JavaScript腳本。在主體部分,使用header、main和footer標簽分別表示了網站的頭部、主要內容以及尾部。header中包含了網站的Logo和導航欄,main中則展示了網站的banner以及熱門商品,footer中包含了版權聲明。同時,使用了各種語義化標簽,如section、ul、li、h2、h3等,讓代碼更加易讀易懂且符合SEO優化的要求。