CSS如何引用本地圖片 在頁面制作中，圖片的應用是非常重要的。而在應用圖片時，我們又會遇到如何引用本地圖片的問題。本文將介紹如何使用CSS來應用本地圖片。 一、圖片的放置位置 在使用CSS引用本地圖片之前，要先確定圖片的放置位置。通常情況下，我們會把圖片放在項目的圖片文件夾內。可以看下面的結構。 ``` Project ├── index.html ├── css │ └── style.css └── images └── logo.png ``` 圖片的放置位置通常為一個單獨的文件夾，例如上方展示的images文件夾。在images文件夾內，我們可以放置多張圖片。 二、CSS引用圖片 在確定圖片的位置之后，我們就可以來學習如何使用CSS引用這些本地圖片。 1、使用background-image background-image是使用最廣泛的引用本地圖片的方法。它可以被用于引用背景圖片，但在許多情況下，它也可以應用于某些元素本身。 `````` 代碼中，我們使用background-image引用了images文件夾內的logo.png圖片。同時還定義了background-size、width、height的屬性值。 2、使用img標簽 除了使用background-image，我們可以使用img標簽來引用本地圖片。這種方式會使你的HTML變得冗長，但更易于修改。 `````` 代碼中，我們使用img標簽引用了images文件夾內的logo.png圖片。同時還定了了img標簽內的width、height的屬性值。 三、總結 本文介紹了如何在頁面制作中使用CSS引用本地圖片。其中包括了使用background-image、img標簽兩種引用方式。在具體使用時，根據自己的需要選擇相應的引用方式即可。