外部圖片在CSS中的使用

在CSS中，我們可以使用多種方法來插入外部圖片，我們可以使用img標簽來插入圖片，

<img src="image.jpg" alt="圖片描述">

在CSS中，我們可以設置img標簽的樣式，

img {
  width: 200px;
  height: 200px;
  border: 1px solid #000;
}

我們還可以使用CSS的background-image屬性來插入圖片，

div {
  background-image: url("image.jpg");
  background-repeat: no-repeat;
  background-size: 200px 200px;
}

在上面的代碼中，我們將圖片作為div元素的背景，并指定了圖片的大小和重復方式，需要注意的是，如果圖片的大小與div元素的大小不匹配，可能會出現(xiàn)圖片拉伸或變形的情況，在設置圖片大小時需要謹慎。

我們還可以使用CSS的偽元素來插入圖片，

div::before {
  content: url("image.jpg");
  display: block;
  width: 200px;
  height: 200px;
}

在上面的代碼中，我們使用偽元素::before來插入圖片，并指定了圖片的大小和顯示方式，需要注意的是，偽元素插入的圖片并不會成為頁面的一部分，而是作為裝飾或背景使用，在設置圖片大小時也需要謹慎。

CSS提供了多種方法來插入外部圖片，我們可以根據(jù)具體的需求和場景來選擇合適的方法。