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