首頁  >  文章  >  web前端  >  css樣式怎麼插入背景圖片

css樣式怎麼插入背景圖片

青灯夜游
青灯夜游原創
2020-12-18 11:10:5621160瀏覽

在css中,可以使用background-image或background屬性來插入背景圖片,基本語法格式為“background-image/background:url('URL')”,參數URL用於指定背景圖片的路徑。

css樣式怎麼插入背景圖片

本教學操作環境:Windows7系統、HTML5 CSS3版本,此方法適用於所有品牌電腦。

推薦:《css影片教學

在css中,可以使用background-image或background屬性來插入背景圖片。

background-image 屬性

background-image 屬性設定一個元素的背景影像。元素的背景是元素的總大小,包括填充和邊界(但不包括邊距)。

語法:

background-image:url('URL'));
  • url('URL')    影像的URL    

#預設情況下,background-image放置在元素的左上角,並重複垂直和水平方向。

提示:請設定一個可用的背景顏色,這樣的話,如果背景圖片不可用,可以使用背景色帶代替。

background屬性

background屬性就是專門設定背景的屬性,可以設定背景色,也​​可以設定背景圖片。

background屬性是一個簡寫屬性,可以在一個宣告中設定所有的背景屬性。

可以設定的屬性分別是:

  • background-color: 規定要使用的背景顏色。

  • background-position: 規定背景影像的位置。

  • background-size: 規定背景圖片的尺寸。

  • background-repeat :規定如何重複背景圖像。

  • background-origin :規定背景圖片的定位區域。

  • background-clip: 規定背景的繪製區域。

  • background-attachment: 規定背景圖像是否固定或隨著頁面的其餘部分滾動。

  • background-image :規定要使用的背景圖片。

範例:

background:url(bgimg.gif) no-repeat 5px 5px;

如下圖解釋:

css樣式怎麼插入背景圖片

背景圖片範例:



	
		
		背景图片设置
		
	
	
		

css樣式怎麼插入背景圖片

更多程式相關知識,請造訪:程式設計入門! !

以上是css樣式怎麼插入背景圖片的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn