HTML5能夠顯示電腦上的圖片,讓網(wǎng)頁內(nèi)容更加豐富。使用<img>
標(biāo)簽可以在網(wǎng)頁中插入圖片,其屬性包括src
、alt
、title
等。以下是一個簡單的圖片顯示代碼:
<img src="圖片路徑" alt="圖片描述" title="鼠標(biāo)放在圖片上時的提示">
其中src
屬性是必須的,指定圖片的路徑。假設(shè)在同一個文件夾下有一張名為picture.jpg
的圖片,那么代碼應(yīng)該如下:
<img src="picture.jpg" alt="一張圖片">
如果圖片的描述與文件名或位置無關(guān),可以使用alt
屬性添加描述信息。這條信息將提供給不能瀏覽圖片的用戶,或者當(dāng)圖片無法加載的時候,將顯示在圖片的位置。例如:
<img src="picture.jpg" alt="一只可愛的貓咪">
此外,title
屬性可以添加鼠標(biāo)懸停時的提示信息,例如:
<img src="picture.jpg" alt="一只可愛的貓咪" title="點擊圖片可以看大圖哦">
以上是基本的圖片顯示代碼,接下來展示如何顯示在多個文件夾下的圖片:
<img src="images/picture.jpg" alt="一只可愛的貓咪">
在src
屬性中通過斜杠指定圖片所在的文件夾images
,然后跟上文件名picture.jpg
。
在以上代碼中,我們使用了<pre>
標(biāo)簽顯示HTML代碼。該標(biāo)簽保留源格式,不會解釋其中的標(biāo)簽,適合用于顯示代碼、JSON等文本格式。