HTMLimg標(biāo)簽的src屬性怎么用-創(chuàng)新互聯(lián)

這篇文章主要介紹了HTML img標(biāo)簽的src屬性怎么用,具有一定借鑒價(jià)值,需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。

創(chuàng)新互聯(lián)公司主營臨武網(wǎng)站建設(shè)的網(wǎng)絡(luò)公司,主營網(wǎng)站建設(shè)方案,app軟件定制開發(fā),臨武h5重慶小程序開發(fā)搭建,臨武網(wǎng)站營銷推廣歡迎臨武等地區(qū)企業(yè)咨詢

首先我們來看看img標(biāo)簽的定義:

圖片也是網(wǎng)頁中最常見的html元素,而且是相當(dāng)重要的一部分。在html網(wǎng)頁中,圖像由<img>標(biāo)簽定義,<img>是空html標(biāo)簽或說是單標(biāo)簽,它只包含屬性,沒有閉合標(biāo)簽。

img標(biāo)簽的src屬性的定義:

<img> 標(biāo)簽的 src 屬性是必需的。它的值是圖像文件的 URL,也就是引用該圖像的文件的的絕對(duì)路徑或相對(duì)路徑。

提示:為了整理文檔的存儲(chǔ),創(chuàng)作者通常會(huì)把圖像文件存放在一個(gè)單獨(dú)的文件夾中,而且通常會(huì)將這些目錄命名為 "pics" 或者 "images" 之類的名稱。在 W3School 在線教程中,我們的工程師把大部分常用的圖像都存放到一個(gè)名為 "i" 的文件夾中,"i"是 "images" 的縮寫,這樣做的好處是可以大程度地簡化路徑。

src屬性是引入圖片的地址,沒有它<img>標(biāo)簽就沒意義了。

HTML img標(biāo)簽的src屬性的格式:

<img src="圖片地址" alt="圖片描述">

說明:圖片地址:儲(chǔ)圖像的位置;圖片描述:對(duì)圖片意思的說明,如果圖片不能顯示,則顯示該說明。

HTML img標(biāo)簽的src屬性的使用說明:

直接給src屬性一個(gè)服務(wù)器端資源的地址,img控件會(huì)自動(dòng)獲取并解析資源。

圖片和HTML文本在同一目錄下:例如index.html和img.jpg

寫法:<img src="img.jpg">

圖片和HTML不在同一目錄下:有分兩種情況:

1.圖片img.jpg在文件夾images中,index.html和images文件夾在同一個(gè)目錄下

寫法:<img src="images/img.jpg">

2.圖片img.jpg在文件夾images中,index.html在controller文件夾中,images和controller文件夾在同一個(gè)目錄下

寫法:<img src="../images/img.jpg">

如果源是來自網(wǎng)上的 那就必須要用絕對(duì)路徑

寫法:<img src="http://www.php.cn/pic/img.jpg">

如果沒有圖片時(shí),瀏覽器將顯示alt中的文字代替。

<img src="lib/img/imgDef.png" alt="暫無圖片" />

img中的src屬性的圖片路徑的使用方式:

1.html文件跟*.jpg文件(f盤)在不同目錄下:

<img src="file:///f:/*jpg" width="300" height="120"/>

2.html文件跟*.jpg圖片在相同目錄下:

<img src=".jpg" width="300" height="120"/>;

3.html文件跟*.jpg圖片在不同目錄下:

a.圖片*.jpg在image文件夾中,*html跟image在同一目錄下:

<img src="image/*jpg/"width="300" height="120"/>

b.圖片*jpg在image文件夾中,*html在connage文件夾中,image跟connage在同一目錄下:

<img src="../image/*jpg/"width="300" height="120"/>

4.如果圖片來源于網(wǎng)絡(luò),那么寫絕對(duì)路徑:

<img src="http://image.php.cn/pcindexhot"/width="300" height="120"/>

HTML img標(biāo)簽的src屬性的屬性:

HTML img標(biāo)簽的src屬性怎么用

感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享HTML img標(biāo)簽的src屬性怎么用內(nèi)容對(duì)大家有幫助,同時(shí)也希望大家多多支持創(chuàng)新互聯(lián)建站,關(guān)注創(chuàng)新互聯(lián)網(wǎng)站制作公司行業(yè)資訊頻道,遇到問題就找創(chuàng)新互聯(lián)建站,詳細(xì)的解決方法等著你來學(xué)習(xí)!

分享文章:HTMLimg標(biāo)簽的src屬性怎么用-創(chuàng)新互聯(lián)
新聞來源:http://muchs.cn/article48/phihp.html

成都網(wǎng)站建設(shè)公司_創(chuàng)新互聯(lián),為您提供自適應(yīng)網(wǎng)站、小程序開發(fā)、全網(wǎng)營銷推廣、網(wǎng)站收錄做網(wǎng)站、網(wǎng)站設(shè)計(jì)公司

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場,如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來源: 創(chuàng)新互聯(lián)

手機(jī)網(wǎng)站建設(shè)