- <!DOCTYPE html>
- <html>
- <head>
- <link rel="stylesheet" href="styles.css">
- </head>
- <body>
- <h1>購物介面</h1>
- <table>
- <tr>
- <td>
- <a href="product1.html">
- <img src="apple.jpg" alt="蘋果" class="index">
- <p>價格: $40</p>
- <p>商品名稱: 蘋果</p>
- </a>
- <button class="buy">購買</button>
- <button class="cart">加入購物車</button>
- </td>
- <td>
- <a href="product2.html">
- <img src="banana.jpg" alt="香蕉" class="index">
- <p>價格: $20</p>
- <p>商品名稱: 香蕉</p>
- </a>
- <button class="buy">購買</button>
- <button class="cart">加入購物車</button>
- </td>
- </tr>
- <tr>
- <td>
- <a href="product3.html">
- <img src="grape.jpg" alt="葡萄" class="index">
- <p>價格: $80</p>
- <p>商品名稱: 葡萄</p>
- </a>
- <button class="buy">購買</button>
- <button class="cart">加入購物車</button>
- </td>
- <td>
- <a href="product4.html">
- <img src="cherry.jpg" alt="櫻桃" class="index">
- <p>價格: $100</p>
- <p>商品名稱: 櫻桃</p>
- </a>
- <button class="buy">購買</button>
- <button class="cart">加入購物車</button>
- </td>
- </tr>
- </table>
- </body>
- </html>
複製代碼- <html>
- <head>
- <link rel="stylesheet" href="styles.css">
- </head>
- <body>
- <a href="prh02.html">
- <button class="index">回首頁</button>
- </a>
- <h1>蘋果商品介面</h1>
- <table>
- <tr>
- <td>
- <img src="apple.jpg" alt="蘋果" class="product">
- </td>
- <td>
- <h1>日本富士頻果</h1>
- <h3>價格: $40</h3>
- <button class="buy">購買</button>
- <button class="cart">加入購物車</button>
- </td>
- </tr>
- </table>
- </body>
- </html>
複製代碼 |