การวางภาพพื้นหลังบนเว็บไซต์เป็นเรื่องห้านาที ใช้เวลามากขึ้นในการเตรียมภาพ - การเลือก การปรับแต่ง การเพิ่มเอฟเฟกต์ การเขียนภาพประกอบหลายภาพเป็นไฟล์กราฟิกไฟล์เดียว
คำแนะนำ
ขั้นตอนที่ 1
แอตทริบิวต์พื้นหลังมีหน้าที่จัดการพื้นหลัง หากต้องการเติมสีเดียวให้เต็มหน้า ให้ใช้แท็กรูปแบบในเนื้อหา: พื้นหลังจะเป็นสีดำ หากใช้ CSS ให้ใส่ในหัวของคุณ: body {background-color: # 000000;}
ขั้นตอนที่ 2
ด้วยความช่วยเหลือของลิงก์ รูปภาพซ้ำจะถูกตั้งค่า ที่อยู่ถูกระบุเป็นลิงค์ภายนอกหรือภายใน เมื่อใช้วิธีนี้ รอยต่อระหว่างรูปภาพจะต้องไม่ปรากฏให้เห็น มิฉะนั้น หน้าจะดูเลอะเทอะ ใน CSS ให้ใช้: body {background-color: # 000000; background-image: url (images / pattern.png);}
ขั้นตอนที่ 3
สามารถควบคุมการทำซ้ำของรูปแบบได้ พื้นหลังซ้ำมีหน้าที่รับผิดชอบสำหรับฟังก์ชันนี้พร้อมกับองค์ประกอบต่อไปนี้: - ซ้ำ -x - การทำซ้ำในแนวนอน - ทำซ้ำ -y - การทำซ้ำในแนวตั้ง: - ทำซ้ำ - การทำซ้ำในทั้งสองทิศทาง - ไม่ซ้ำ - ไม่มีการทำซ้ำ มันถูกตั้งค่าเหมือน นี่: ร่างกาย {สีพื้นหลัง: # 000000; ภาพพื้นหลัง: url ("butterfly.gif"); พื้นหลังซ้ำ: ไม่ซ้ำ; }
ขั้นตอนที่ 4
ตำแหน่งพื้นหลังช่วยจัดตำแหน่งรูปภาพในส่วนที่ต้องการของหน้าเว็บ พิกัดสามารถกำหนดได้โดยใช้เปอร์เซ็นต์ (50% 75%), เซนติเมตร (5 ซม. 5 ซม.), ด้านพิกเซล (200px 400px), รูปแบบคำ (ซ้าย, ขวา, บน, กลาง, ล่าง) ตัวอย่างเช่น: เนื้อหา {สีพื้นหลัง: # 000000; ภาพพื้นหลัง: url ("butterfly.gif"); พื้นหลังซ้ำ: ไม่ซ้ำ; ไฟล์แนบพื้นหลัง: แก้ไข; พื้นหลังตำแหน่ง: ล่างซ้าย; } ค่า 0% 0% เท่ากับด้านบนซ้าย
ขั้นตอนที่ 5
คุณสมบัติ background-attachment ระบุว่ารูปภาพจะถูกเลื่อนไปพร้อมกับหน้า (background-attachment: scroll) หรือไม่ (background-attachment: fixed)