HTML&CSS基礎-html的圖檔标簽
作者：尹正傑
版權聲明：原創作品，謝絕轉載！否則将追究法律責任。
一.如下圖所示，準備一張圖檔，存放路徑和html檔案在同一目錄
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>尹正傑的網頁</title>
<head>
<body>
<h1>我的部落格位址:<font color="red" size="7">https://www.cnblogs.com/yinzhengjie/</font></H1>
<!--
使用img标簽來向網絡中引入一個外部圖檔。img标簽也是一個自結束标簽。
屬性:
src:
設定一個外部圖檔的路徑。目前我們所要使用的路徑全都是相對路徑。
相對路徑:
相對路徑指相當于目前資源所在目錄的位置
alt:
可以設定圖檔不能顯示時，對圖檔的描述;
搜尋引擎可以通過alt屬性來識别不同的圖檔;
如果不寫alt屬性，則搜尋引擎不會對img中的圖檔進行收錄
width:
可以用來修改圖檔的寬度,一般使用px(像素)作為機關
height:
可以用來修改圖檔的高度,一般使用px(像素)作為機關
溫馨提示:
寬度和高度兩個屬性如果指設定一個，另一個也會同時等比例調整大小;
如果兩個值同時指定則按照你指定的值來設定
一般開發中除了自适應的頁面，不建議設定width和height。
圖檔的格式:
JPEG(JPG):
JPEG圖檔支援的顔色比較多，圖檔可以壓縮，但是不支援透明
一般使用JPEG來儲存照片等顔色豐富的圖檔。
GIF:
GIF支援的顔色少，隻支援簡單的透明，支援動态圖。
圖檔顔色單一或者動态圖可以使用gif
PNG:
PNG支援的顔色多，并且支援複雜的透明
可以用來顯示顔色複雜的透明的圖檔。
圖檔的使用原則：
效果不一緻，使用效果好的
效果一緻，使用小的
-->
<img src="./01.jpg" alt="火影忍者" width="800px" height = "700px"/>
</body>
</html> 三.浏覽器打開以上代碼渲染結果
當你的才華還撐不起你的野心的時候，你就應該靜下心來學習。當你的能力還駕馭不了你的目标的時候，你就應該沉下心來曆練。問問自己，想要怎樣的人生。
歡迎加入基礎架構自動化運維：598432640，大資料SRE進階之路：959042252，DevOps進階之路：526991186