HTML和CSS是網頁開發中必不可少的兩個技術，其中圖片引用是在網頁中使用最廣泛的一種素材。下面將介紹如何在HTML和CSS中引用圖片的代碼。 首先，在HTML中引用圖片需要使用img標簽，其常用屬性如下： 1. src：指定圖片的路徑（可以是相對路徑或絕對路徑）； 2. alt：設置圖片的替代文本，當圖片無法顯示或被屏幕閱讀器讀取時會用到； 3. width、height：設置圖片的寬度和高度； 4. title：設置圖片的標題，鼠標懸停可見。 以下是一個簡單的HTML代碼示例，展示如何使用img標簽來引用圖片：

<p>這是一段文字，其中包含了一張圖片：</p>
<img src="images/example.jpg" alt="這是一張示例圖片" width="300" height="200" title="這是一張示例圖片">

其中，圖片路徑為“images/example.jpg”，圖片的替代文本為“這是一張示例圖片”，寬度和高度分別為300和200像素，鼠標懸停時會顯示“這是一張示例圖片”的標題。 接下來，我們將介紹如何在CSS中引用背景圖片。在CSS中，我們可以使用background屬性來設置元素的背景，它的常用屬性如下： 1. background-image：指定背景圖片的路徑； 2. background-repeat：指定如何重復顯示背景圖片； 3. background-position：設置背景圖片的起始位置； 4. background-size：設置背景圖片的尺寸。 以下是一個簡單的CSS代碼示例，展示如何使用background屬性來引用背景圖片：

<style>
body {
background-image: url("images/bg.jpg");
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}
</style>

其中，背景圖片路徑為“images/bg.jpg”，不會在背景中重復顯示，起始位置為屏幕中央，將根據屏幕大小等比例縮放以填滿整個背景區域。 總之，圖片引用是網頁開發中常用的技術，簡單的HTML和CSS代碼可以輕松添加和調整頁面中的圖片。