HTML学习总结 基础篇 图像标签imag的使用及其属性
生活随笔
收集整理的這篇文章主要介紹了
HTML学习总结 基础篇 图像标签imag的使用及其属性
小編覺得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
圖像標(biāo)簽
在HTML中，用img標(biāo)簽顯示圖像。
語(yǔ)法格式： < img src=" 圖像路徑">，src為必須要寫的元素，用于指定文件的路勁和文件名
| src | 圖片路徑 | 必須屬性 |
| alt | 文本 | 替換文本。圖像不能顯示的文字 |
| title | 文本 | 提示文本。鼠標(biāo)放到圖像上，顯示的文字 |
| width | 像索 | 設(shè)置圖像的寬度 |
| height | 像素 | 設(shè)置圖像的高度 |
| border | 像索 | 設(shè)置圖像的邊框粗細(xì) |
示例代碼：
<html lang="en"> <head><meta charset="UTF-8"><title>圖像標(biāo)簽及其屬性</title> </head> <body><h3>使用img引用圖像，src為路徑</h3><img src="imag_l.jpg"><h3>alt表示的是在圖片加載不出來(lái)顯示不了時(shí)代替的文字</h3><img src="imag_l.jpg" alt="這是一張海賊王的圖片"><h3>title表示在鼠標(biāo)移到圖片時(shí)，在鼠標(biāo)旁邊提示的文字</h3><img src="imag_l.jpg" title="這是一張海賊王的圖片"><h3>width height border 就是圖片的長(zhǎng)寬，邊框的粗細(xì)</h3><img src="imag_l.jpg" width="600px" height="300px" border="700"> </body> </html> 在這里插入代碼片圖像標(biāo)簽的路徑
目錄文件夾： 就是普通文件夾，里面存放了我們做頁(yè)面所需要的相關(guān)素材。
根目錄：打開目錄文件夾的第一層就是根目錄
路徑可以分為相對(duì)路徑和絕對(duì)路徑
相對(duì)路徑
相對(duì)路徑：以引用文件夾所在位置為參考基礎(chǔ)，而建立出的目錄路徑。 也就是相對(duì)于當(dāng)前編寫的HTML文件的位置 如果相對(duì)于HTML文件屬于同一級(jí)的文件夾，則可以直接寫文件名引用。如果圖片相對(duì)于HTML文件屬于下一級(jí)文件，則需要用文件夾名/圖片文件名 引用圖片。
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>圖像標(biāo)簽及其屬性</title> </head> <body><h3>使用img引用圖像，src為路徑</h3><img src="imag_l.jpg"><img src="images/imag_first.jpg"> </body> </html>如果圖片相對(duì)于HTML文件屬于上一級(jí)路徑，則使用**…/** 引用圖片
<!DOCTYPE html> <html lang="en"> <head><meta charset="UTF-8"><title>圖像標(biāo)簽及其屬性</title> </head> <body><h3>使用img引用圖像，src為路徑</h3><img src="../image/image_lf.jpg"> </body> </html>絕對(duì)路徑
絕對(duì)路徑：是指目錄下的絕對(duì)位置,直接到達(dá)目標(biāo)位置,通常是從盤符開始的路徑。
總結(jié)
以上是生活随笔為你收集整理的HTML学习总结 基础篇 图像标签imag的使用及其属性的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇： WebSphere启动时遇到javax.
- 下一篇： html页面上使用vlc,在HTML页面