วิธีการใส่พื้นหลังบนเว็บไซต์

สารบัญ:

วิธีการใส่พื้นหลังบนเว็บไซต์
วิธีการใส่พื้นหลังบนเว็บไซต์

วีดีโอ: วิธีการใส่พื้นหลังบนเว็บไซต์

วีดีโอ: วิธีการใส่พื้นหลังบนเว็บไซต์
วีดีโอ: ภาษา HTML คำสั่งใส่สีพื้นหลัง,ใส่ภาพพื้นหลังเว็บไซต์ 2024, อาจ
Anonim

พื้นหลังการทำงานของไซต์สามารถเปรียบเทียบได้กับวอลเปเปอร์สำหรับเดสก์ท็อปของระบบปฏิบัติการของคุณ พื้นหลัง (พื้นหลัง) คุณสามารถสร้างได้หลายรูปแบบ ซึ่งจะกล่าวถึงด้านล่าง

วิธีการใส่พื้นหลังบนเว็บไซต์
วิธีการใส่พื้นหลังบนเว็บไซต์

จำเป็น

การแก้ไขไฟล์ style.css

คำแนะนำ

ขั้นตอนที่ 1

พื้นหลังขาวดำ พื้นหลังแบบธรรมดาที่สุด ข้อดีอีกอย่างคือการโหลดหน้าน้อยที่สุดโดยใช้รูปภาพดังกล่าว หากไฟล์รูปแบบ (style.css) ไม่มีคำสั่งที่กำหนดสีพื้นหลัง เบราว์เซอร์จะแนะนำสีขาวตามค่าเริ่มต้น ใช้คำสั่ง background-color เพื่อเปลี่ยนสี ตัวอย่างการใช้คำสั่งนี้: background-color: # 3366CC

ขั้นตอนที่ 2

ในการเลือกสีเฉพาะ คุณสามารถใช้ซอฟต์แวร์พิเศษ เช่น โปรแกรมแก้ไขกราฟิก Adobe Photoshop หากคุณไม่เคยใช้งานมาก่อน ขอแนะนำให้ใช้บริการเว็บ ตัวอย่างที่โดดเด่นคือเครื่องมือค้นหา "Yandex" ไปที่ลิงก์ต่อไปนี้ https://yandex.ru และป้อนวลี "color blue" ตารางสีจะปรากฏขึ้นต่อหน้าคุณ ซึ่งคุณสามารถเลือกสีใดก็ได้ตามต้องการ คัดลอกโค้ดแล้ววางลงในโค้ดของไซต์

ขั้นตอนที่ 3

เนื้อพื้นหลัง นอกจากสีพื้นหลังแล้ว คุณสามารถเพิ่มรูปภาพหรือรูปแบบที่วนซ้ำ (พื้นผิว) ในหน้าใดก็ได้ในไซต์ของคุณ เมื่อต้องการทำสิ่งนี้ หลังจากป้อนสีพื้นหลังแล้ว ให้เขียนคำสั่ง background-image เช่น background-image: url (img / uzor.png) ต้องระบุพาธไปยังไฟล์ในวงเล็บ เป็นที่น่าสังเกตว่าความละเอียดของพื้นผิวสามารถเริ่มจากเล็กที่สุด (16x16) และลงท้ายด้วยภาพขนาดเต็มสำหรับขนาดของหน้าเว็บไซต์ (800x600 ขึ้นไป)

ขั้นตอนที่ 4

พื้นหลังโดยใช้การไล่ระดับสี ในกรณีนี้ คุณกำลังใช้สีพื้นหลังที่ตั้งค่าด้วยคำสั่งสีพื้นหลัง แต่สร้างการไล่ระดับสี การไล่ระดับสีสามารถเป็นแนวนอน (x) และแนวตั้ง (y) ส่วนใหญ่มักใช้ตำแหน่งแนวนอนเป็นการไล่ระดับสีพื้นหลัง ดังนั้นเส้นที่มีการไล่ระดับสีจะมีลักษณะดังนี้: background-repeat: repeat-x