iT邦幫忙

2025 iThome 鐵人賽

DAY 12
0

今天我們要來編輯地址和聯絡我們的分頁

1.先到address.html的檔案裡開始編輯地址分頁的內容
這裡我們要放商店的地址和google地圖,首先加入程式<h1>商店地址</h1>,然後再放置google 地圖,要放置google地圖要先在google地圖網頁搜尋店家的名稱,然後按分享之後點嵌入地圖的選項,下
面會有複製HTML的選項給他點選起來後,再貼上程式中就完成了

嵌入google地圖
https://ithelp.ithome.com.tw/upload/images/20250814/201760520ad1Ni3fPE.png

HTML程式
https://ithelp.ithome.com.tw/upload/images/20250814/20176052lYwhYEqKJs.png

2.置中文字和地圖
我們用css來置中

css程式
https://ithelp.ithome.com.tw/upload/images/20250814/20176052xoShoFDS5M.png

網頁方面
https://ithelp.ithome.com.tw/upload/images/20250814/201760527nmueY9imq.png

3.接下來到content.html的檔案裡編輯聯絡我們分頁的內容
這裡我們要放商店的line加好友的Qrcode,首先加入程式<h2>加Line好友</h2>,然後再放置
lineQrcode的圖片

HTML程式
https://ithelp.ithome.com.tw/upload/images/20250814/20176052MCSireWoGf.png

4.置中文字和圖片
我們用css來置中

css程式
https://ithelp.ithome.com.tw/upload/images/20250814/20176052OMWwCkIzxf.png

網頁方面
https://ithelp.ithome.com.tw/upload/images/20250814/20176052Uwe4zvj9El.png

今天先到這裡明天繼續!


上一篇
Day11:新增跳轉的頁面
下一篇
Day13:編輯分頁的內容
系列文
從0到有做出一個商家網頁30
圖片
  熱門推薦
圖片
{{ item.channelVendor }} | {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言