<html> <head> <title>第一個網頁</title> </head> <body> ***************圖片元素******************</br> <img src='mm.jpg' /> </body> </html>
新建一個文件夾“text”,在text文件夾內新建index.html並放入一張圖片mm.jpg
在index.html中寫入 <img src="a.jpg" /> 保存
打開index.html
更改圖片大小<img src='mm.jpg' width=170px />只需寫width,height會隨着width自動比例變換
另外我們使用“../”來表示上一級目錄，“../../”表示上上級的目錄，以此類推。
<img src="" />
如果圖片和html文件在同一目錄，就直接寫*.jpg
如果圖片的文件夾和html在同一目錄，就寫/../*.jpg
說明，圖片可以鏈接外部網絡的URL
例如百度頁面上百度的logo，在logo上右鍵復制圖片地址，將圖片地址復制到src中
<img src='https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo_top_ca79a146.png' width=120px /> <img src='https://ss0.bdstatic.com/5aV1bjqh_Q23odCf/static/superman/img/logo_top_ca79a146.png' width=120px border=1 />
觀察上面兩行，第二個多了border，圖片顯示的效果是圖片外面一圈有黑色框，border的屬性值可以更改
<img src='mm.jpg' width=170px /> <img src='mm.jpg' width=170px /> <img src='mm.jpg' width=170px /> <img src='mm.jpg' width=170px /> <img src='mm.jpg' width=170px /> <img src='mm.jpg' width=170px /> <img src='mm.jpg' width=170px /> <img src='mm.jpg' width=170px />
觀察效果，相同的圖片可以顯示多次
