html圖片如何插入

這篇文章主要介紹html圖片如何插入，文中介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們一定要看完！

html有什么特點(diǎn)

1、簡易性：超級(jí)文本標(biāo)記語言版本升級(jí)采用超集方式，從而更加靈活方便，適合初學(xué)前端開發(fā)者使用。 2、可擴(kuò)展性：超級(jí)文本標(biāo)記語言的廣泛應(yīng)用帶來了加強(qiáng)功能，增加標(biāo)識(shí)符等要求，超級(jí)文本標(biāo)記語言采取子類元素的方式，為系統(tǒng)擴(kuò)展帶來保證。  3、平臺(tái)無關(guān)性：超級(jí)文本標(biāo)記語言能夠在廣泛的平臺(tái)上使用，這也是萬維網(wǎng)盛行的一個(gè)原因。 4、通用性：HTML是網(wǎng)絡(luò)的通用語言，它允許網(wǎng)頁制作人建立文本與圖片相結(jié)合的復(fù)雜頁面，這些頁面可以被網(wǎng)上任何其他人瀏覽到，無論使用的是什么類型的電腦或?yàn)g覽器。

在HTML中可以通過<img>標(biāo)簽插入圖片，插入的代碼如“<img src="dinosaur.jpg">”，其中src屬性包含了指向我們想要引入的圖片的路徑，可以是相對(duì)路徑或絕對(duì)URL。

本文操作環(huán)境：windows7系統(tǒng)、HTML5&&CSS3版，DELL G3電腦。

我們可以用<img> 元素來把圖片放到網(wǎng)頁上。它是一個(gè)空元素（它不需要包含文本內(nèi)容或閉合標(biāo)簽），最少只需要一個(gè) src （一般讀作其全稱 source）來使其生效。src 屬性包含了指向我們想要引入的圖片的路徑，可以是相對(duì)路徑或絕對(duì)URL，就像 <a> 元素的 href 屬性一樣。

注意：在繼續(xù)之前，你應(yīng)該閱讀快速入門URL和路徑來復(fù)習(xí)一下相對(duì)和絕對(duì)URL。

舉個(gè)例子來看，如果你有一幅文件名為 dinosaur.jpg 的圖片，且它與你的 HTML 頁面存放在相同路徑下，那么你可以這樣嵌入它：

<img src="dinosaur.jpg">

如果這張圖片存儲(chǔ)在和 HTML 頁面同路徑的 images 文件夾下（這也是Google推薦的做法，利于SEO/索引），那么你可以采用如下形式：

<img src="images/dinosaur.jpg">

以此類推。

注意：搜索引擎也讀取圖像的文件名并把它們計(jì)入SEO。因此你應(yīng)該給你的圖片取一個(gè)描述性的文件名：dinosaur.jpg 比 img835.png 要好。

你也可以像下面這樣使用絕對(duì)路徑：

<img src="https://www.example.com/images/dinosaur.jpg">

但是這種方式是不被推薦的，這樣做只會(huì)使瀏覽器做更多的工作，例如重新通過 DNS 再去尋找 IP 地址。通常我們都會(huì)把圖片和 HTML 放在同一個(gè)服務(wù)器上。

以上是“html圖片如何插入”這篇文章的所有內(nèi)容，感謝各位的閱讀！希望分享的內(nèi)容對(duì)大家有幫助，更多相關(guān)知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道！