การนำรูปภาพมาตกแต่ง

การใส่รูปภาพฉากหลังให้เว็บเพจ การนำรูปภาพมาใส่เป็นฉากหลัง (Background) ของเว็บเพจ เพื่อสร้างความสะดุดตาและน่าสนใจ แต่ต้องเลือกรูปภาพที่จะนำมาใช้ด้วยความระมัดระวัง เช่น ไม่ควรใช้รูปภาพที่มีลวดลายบาดตา เพราะอาจจะทำให้ผู้ชมสับสนและอ่านข้อความได้ยาก ขนาดของรูปภาพต้องไม่ใหญ่เกินไป เพราะจะทำให้เว็บเพจโหลดได้ช้า นอกจากนี้ ตามปกติรูปภาพฉากหลังจะถูกแสดงโดยเรียงซ้ำ ๆ ต่อ ๆ กันจนเต็มพื้นที่ ดังนั้น จึงควรใช้รูปภาพที่มีขอบกลมกลืนกัน หรือสามารถเรียงต่อกันได้โดยไม่เห็นรอยต่อระหว่างภาพ

1. คลิกเมนูย่อย Modify -> Page Properties
2. เลือกกลุ่ม Appearance
3. คลิกปุ่ม หลังช่อง Background image
4. ใช้ไดอะล็อกบ็อกซ์ Select Image Soucre
5. เลือกไฟล์รูปภาพที่ต้องการนำมาเป็นฉากหลัง
6. คลิกปุ่ม OK
7. เลือกการแสดงภาพซ้ำในช่อง Repeat ดังนี้

no-repeat ไม่ทำซ้ำ
repeat ทำซ้ำจนเต็มพื้นเว็บเพจ
repeat-x ทำซ้ำตามแนวนอน (บนสุด)
repeat-y ทำซ้ำตามแนวตั้ง (ซ้ายสุด)

8. คลิกปุ่ม OK
||

การใส่รูปภาพลงบนเว็บเพจ เมื่อเรานำรูปภาพมาใส่ลงบนเว็บเพจ โปรแกรม Dreamweaver จะสร้างโค้ด HTML ที่เป็นคำสั่งในการแสดงรูปภาพ คือ แท็ก <img> ซึ่งจะระบุตำแหน่งที่เก็บและขนาดของรูปภาพโดยอัตโนมัติ ขั้นตอนการใส่รูปภาพลงบนเว็บเพจสามารถทำได้หลายวิธี คือ		คลิกปุ่ม Image บนกลุ่มคำสั่ง Common บน Insert Toolbar (หากปุ่มแสดงเป็นคำสั่ง
	อื่น ให้คลิกลูกศรข้างปุ่ม แล้วเลือก Image)
	เลือกเมนูย่อย Insert -> Image
	ลากไฟล์รูปภาพจากพาเนล Assets มาวางบนเว็บเพจ (แสดงพาเนลโดยคลิกเมนูย่อย
	Window -> Assets)
	ลากไฟล์รูปภาพจากพาเนล Files มาวางบนเว็บเพจ (แสดงพาเนลโดยคลิกเมนูย่อย Window ->
	Files)
	ลากไฟล์รูปภาพจากโฟลเดอร์ของ Windows มาวางบนเว็บเพจ ในวินโดว์ของ Dreamweaver

การใส่รูปภาพลงบนเว็บเพจด้วยเมนูคำสั่ง


1. คลิกวางเคอร์เซอร์ตรงตำแหน่งที่ต้องการใส่รูปภาพ
2. คลิกเมนูย่อย Insert -> Image หรือคลิกปุ่ม Image บน Insert Toolbar


3. เลือกแหล่งที่จะต้องจะใช้รูปภาพ (ปกติเลือก File system)
4. คลิกช่อง Look in เพื่อเปิดไปยังไดรฟ์ และโฟลเดอร์ที่เก็บไฟล์รูปภาพ
5. เลือกไฟล์รูปภาพที่ต้องการ และดูตัวอย่างรูปภาพทางด้านขวา
6. เลือกวิธีการอ้างอิงตำแหน่งรูปภาพ (ปกติเลือก Document)
7. คลิกปุ่ม OK


8. ถ้ามีข้อความแจ้งว่ารูปภาพนี้อยู่นอกเว็บไซต์ ให้คัดลอก (Copy) เข้ามาไว้ในเว็บไซต์ โดยคลิกปุ่ม Yes
9. เลือกโฟลเดอร์เก็บรูปภาพ (ควรสร้างโฟลเดอร์ images เพื่อเก็บไฟล์รูปภาพรวมไว้ที่เดียวกัน)
10. คลิกปุ่ม Save
||