iT邦幫忙

2021 iThome 鐵人賽

DAY 13
0
Modern Web

33歲轉職者的前端筆記系列 第 13

33歲轉職者的前端筆記-DAY 13 圖片格式及影音格式

  • 分享至 

  • xImage
  •  

圖片

網頁上一定會有多許多圖片元素我們在開發網站時需多了解圖片的特性及格式,在開發的過程會更加順利。

圖片標籤

  • img 為在 HTML 中 插入圖片的標籤語法
  • 寫法為:<img src="圖片路徑" alt="圖片名稱">
  • src 分為相對路徑與絕對路徑
  • 絕對路徑:直接從網頁圖片複製圖片網址
  • 相對路徑:把圖片把存到圖片資料夾在抓取路徑

圖片格式

以下常見的圖片格式有:

  • jpg:解析度最小
  • jpeg
  • gif
  • png:png8 png32 解析度最大
  • apng
  • spng
  • svg:近幾年較盛行, 不會被壓縮失真
  • webp:近兩三年盛起google 推出來的,任何圖片格式都可以轉webp

https://ithelp.ithome.com.tw/upload/images/20210913/20120789pBDcL8x2BW.jpg

影音標籤格式

常見的影音格式如下:

  • video
  • audio
  • source
  • 格式:mp4 webm

https://ithelp.ithome.com.tw/upload/images/20210913/20120789vAR5xOwMb7.jpg


上一篇
33歲轉職者的前端筆記-DAY 12 一些網頁切版技巧的小筆記-Part 3
下一篇
33歲轉職者的前端筆記-DAY 14 排版技巧小筆記-標籤屬性元素及定位方法
系列文
33歲轉職者的前端筆記30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言