CSS - ภาพพื้นหลัง

คำอธิบาย

background-image กำหนดตัวชี้ไปยังทรัพยากรรูปภาพซึ่งจะถูกวางไว้ในพื้นหลังขององค์ประกอบ

ค่าที่เป็นไปได้

  • uri - URL ของภาพ

  • none - การตั้งค่าภาพพื้นหลังเป็นไม่มีหมายความว่าไม่ควรใช้ภาพพื้นหลังในการจับคู่องค์ประกอบ

  • transparent

นำไปใช้กับ

องค์ประกอบ HTML ทั้งหมด

ไวยากรณ์ DOM

object.style.backgroundImage = "Any value as defined above";

ตัวอย่าง

ต่อไปนี้เป็นตัวอย่างที่สาธิตวิธีการตั้งค่าภาพพื้นหลังสำหรับองค์ประกอบ

<html>
   <head>
      <style>
         body {
            background-image: url("/https/isolution.pro/css/images/css.jpg");
            background-color: #cccccc;
         }
      </style>
   </head>
   
   <body>
      <h1>Hello World!</h1>
   </body>
<html>

มันจะให้ผลลัพธ์ดังต่อไปนี้ -


CSS ตอบสนอง

Language