# DAY2 - 在網頁插入圖片 / img

### 將圖片插入在資料夾:

1. 將 `logo.ong` 放入開發專案資料夾中 - `index.html` 當前相同位置:


- 目前資料夾有以上三個項目: 我們來嘗試開始撰寫程式碼吧!

./ 表示為當前資料夾的位置，再如就是載入圖檔。

<img src="./logo.png" alt="" />


### 放置在分類資料夾之中，並且指定圖檔:

- 承上範例，請將 `logo.png`拉動至 `img` 資料夾中

接著，程式碼寫法如下:

- 此時，寫法就不是./ 而是改由 img/指定檔案嚕!

<img src="img/logo.png" alt="" />

---

### 如何插入『外部圖片』?

- 如果在瀏覽網頁時，發現喜歡的圖片，如何運用在自己設計的網站上?

例如我喜歡這張圖片，使用 mac 為範例:

按下右鍵，複製圖片位置即可將複製的連結貼到 **src**


///

    <img src="https://img.ltn.com.tw/Upload/sports/page/800/2022/12/13/phpBPhB1J.jpg" alt="" />

###### tags: `Re:0 前端工程師之路 - HTML CSS 篇章`