*~*แจกโค๊ด+ของแต่งhi5คะ*~*

ลำดับตอนที่ #4 : *~*Code เปลี่ยนหัวข้อเป็นรูปต่างจากตอน3คะ*~*

สำหรับตอนนี้นั้น

เป็นการเปลี่ยนหัวข้อต่างๆเหมือนตอนที่3คะ

แต่ต่างกันตรงที่

ตอนที่สามจะเป็นแบคกราว แล้วเห็นตัวหนังสือของมันเอง

แต่ตอนนี้ จะเป็นรูปทับลงไปเลย

ซึ่ง เวลาทำรูปจึงต้องใส่ชื่อลงไปด้วยคะ

และ ที่ต่างกันมากคือ
ต้องใส่รูปทีละรูปคะ
ไม่เหมือนกับตอนที่3ที่ใส่ไปรูปเดียวใช้ได้เลยคะ

เลือกใส่ได้แต่ละหัวข้อเลยคะ
ถ้าอยากให้ส่วนสูงต่างกัน ก้อให้เปิดโค๊ดใหม่คะ
ต้องการเปลี่ยนหัวข้อไหนก้อเลือกเลยนะคะ
* เปลี่ยนเฉพาะส่วนhi1คะ ถ้าต้องการให้ส่วนhi2เข้ากัน
แนะนำให้ใช้โค๊ดในตอนที่3ดัดแปลงนะคะ


<style>

.section h1 {margin-top:10px;height:ความสูงของรูปpx;}

#recent-updates h1 { text-indent:-9999px;background: url(URL ของรูปที่ใช้แทนหัวข้อ Update );
background-position:right;background-repeat:no-repeat;}

#lifestyle h1 { text-indent:-9999px;background: url(URL ของรูปที่ใช้แทนหัวข้อ Life Style);
background-position:right;background-repeat:no-repeat;}

#interests h1 { text-indent:-9999px;background: url(URL ของรูปที่ใช้แทนหัวข้อ Interests);
background-position:right;background-repeat:no-repeat;}

#journalDetail h1 { text-indent:-9999px;background: url(URL ของรูปที่ใช้แทนหัวข้อ Journal);
background-position:right;background-repeat:no-repeat;}

#friends h1 { text-indent:-9999px;background: url(URL ของรูปที่ใช้แทนหัวข้อ Friend);
background-position:right;background-repeat:no-repeat;}

#photoAlbums h1 { text-indent:-9999px;background: url(URL ของรูปที่ใช้แทนหัวข้อ Photo Albums);
background-position:right;background-repeat:no-repeat;}

#user-fives h1 { text-indent:-9999px;background: url(URL ของรูปที่ใช้แทนหัวข้อ Five);
background-position:right;background-repeat:no-repeat;}

#comments h1 { text-indent:-9999px;background: url(URL ของรูปที่ใช้แทนหัวข้อ Comment);
background-position:right;background-repeat:no-repeat;}

#groups h1 { text-indent:-9999px;background: url(URL ของรูปที่ใช้แทนหัวข้อ Groups);
background-position:right;background-repeat:no-repeat;}

</style>

ถ้าต้องการแยกส่วนให้ส่วนสูงต่างกันให้แยกอย่างนี้คะ
โดยเลือกหัวข้อมาเลยคะ

<style>

.section h1 {margin-top:10px;height:เปลี่ยนความสูงpx;}

#recent-updates h1 { text-indent:-9999px;background: url(URL ของรูปที่ใช้แทนหัวข้อ Update );
background-position:right;background-repeat:no-repeat;}

</style>

ตัวอย่าง
ดูได้ที่

ตรงที่ส่วนสูงต่างจากเพื่อนของเรา
คือตรงที่เป็นหัวข้อcommentนะคะ