การใส่ภาพพื้นหลัง

  ติดต่อ

  เรามาลองใส่ภาพที่ต้องใช้ repeat-y กันดีกว่า  

เนื่องจากบางคนที่มีภาพที่จะทำเป็นภาพพื้นหลังมีลักษณะเป็นภาพสี่เหลี่ยมผืนผ้า ดังภาพที่เห็นนี้

สำหรับภาพที่ดิฉันมีนี้ก็มีขนาด width 1024 pixel และ high 30 pixel ซึ่งสังเกตุได้ว่าขนาดความสูงของภาพนั้นไม่เท่ากับขนาดของบล็อก ถ้าเราใช้การ repeat-y จึงสามารถทำให้ภาพของเรานั้นกลายเป็นภาพพื้นหลังได้ค่ะ สามารถดูผลของการ repeat-y ได้ที่นี่ค่ะ เล่นของเล่นใหม่ทั้งวัน
เราสามารถที่จะทำเป็นภาพพื้นหลังได้โดยการใช้โค้ด ดังนี้

  body
{
background: #ffffff;
background-image:
url("/file/jantana811/heart.gif ");
background-repeat: repeat-y;
}

ส่วนสีส้มก็คือภาพที่เราเอาขึ้นไปใน "ไฟล์รูปภาพ" และการ repeat-y ตรงส่วนนี้ก็คือการปูพื้นภาพนั้นซ้ำๆเฉพาะแนวตั้งนั่นเองค่ะ

สามารถใส่ CSS ส่วนนี้ไว้ที่ แผงควบคุม > บล็อกที่เลือก > แก้ไข > CSS ที่ตกแต่งเอง เท่านี้ก็เรียบร้อยแล้วค่ะ

บันทึกนี้เขียนที่ GotoKnow โดย  ใน การเรียนรู้ CSS ครั้งแรก

หมายเลขบันทึก: 58758, เขียน: , แก้ไข, 2013-09-06 17:37:30+07:00 +07 Asia/Bangkok, สัญญาอนุญาต: สงวนสิทธิ์ทุกประการ, ความเห็น: 3, อ่าน: คลิก

คำสำคัญ (Tags) #css

บันทึกล่าสุด 

ความเห็น (3)

รูปหัวใจที่เอามา เราว่ามันแปลกๆนะ เล็กลงกว่าขนาดจริงหรือเปล่าจ๊ะ มันเลยผิดรูปไปหน่อย แต่ก็น่ารักมากจ๊ะ
นายโน้ต
IP: xxx.24.160.220
เขียนเมื่อ 
เอาซะหน่อย ถ้าเกิดว่า รูปภาพมันซ้ำกันแบบนี้อ่ะ ก็ไม่น่าจะเอาขนาด 1024 x 30 เลยอ่ะ มันก็จะต้องโหลดนานอ่ะ (สำหรับเนตไม่แรงอ่ะ) น่าจะ crop เหลือเฉพาะส่วนแรกส่วนเดียวก็พออ่ะ (หัวใจดวงเดียวก็พอ) ที่เหลือ server มันทำงานให้ที่จะ repeat อ่ะ แล้วจะได้โหลดเร็วขึ้นอีกนิดนะ
NEVER_DIE
IP: xxx.151.232.70
เขียนเมื่อ 

ดีมากๆๆๆๆๆๆๆๆๆๆๆๆ