รวมโค้ดเกี่ยวกับส่วนของ Header ของ Hi5 เพจนะคะ ใครมีโค้ดอยู่ก็เอามาลงได้เลย ลงภาพด้วยก็ดีนะคะ จะได้เข้าใจง่าย ๆ :)

ใส่แบนเนอร์ตรงชื่อ profile

ิbanner on profile name's section



#profile-name { background-image: url(http://img248.imageshack.us/img248/8942/bnex7.gif);background-position: center center; background-repeat:no-repeat; height:340px;text-align:center; color: #ffffff;padding-top:50px;border:none}

ว่าด้วยเรื่องแถบล๊อคอิน



--------------------------------------------------------

ใส่พื้นหลังให้แถบล๊อคอิน (ไม่มีคำว่า Hi5)


#p_nav_header {background: url(รูป) repeat top center;height: ความสูงpx; border:none;} #new_header {background:none} #primenu li.on {background:none}

--------------------------------------------------------

ทำให้ใสมองเห็นบีจี (ไม่มีคำว่า Hi5)


#p_nav_header {background:none; border: none} #new_header {background:none} #primenu li.on {background:none; border: none}

--------------------------------------------------------

เอาช่องค้นหาออก


#glsearch strong a {display:none} input#search_text {display:none} input#search_button {display:none}

--------------------------------------------------------

ใส่พื้นหลังในช่องค้นหา


input#search_text {background: url(รูป)}

--------------------------------------------------------

เปลี่ยนสีตัวอักษรตรง หน้าแรก โปรไฟล์ของฉัน ฯลฯ


#primenu li a {color:รหัสสี}

--------------------------------------------------------

เปลี่ยนสีตัวอักษรตรง คำว่า ยินดีต้อนรับ+ชื่อ


#userstuff {color:รหัสสี}

--------------------------------------------------------

เปลี่ยนสีตัวอักษรตรง คำว่า ออกจากระบบ บัญชี ความเป็นส่วนตัว วิธีใช้


#new_header a {color:รหัสสี}

--------------------------------------------------------

เปลี่ยนรูปลูกโลก เป็นไอคอนอื่น


#language-more img {visibility: hidden} #language-more {background:url(รูป) center no-repeat;}

ว่าด้วยเรื่อง Profile name



ทำให้พื้นหลังใส
#profile-name {background:none}

ลบชื่อ Profile
.profile-nav .name strong {display:none}

ลบคำ :: My Profile
#profile-name span {display:none}

ลบจำนวนการเข้าดู Profile
.profile-nav .name span {display:none}

สีตัวอักษร
#profile-name { color: รหัสสี }

ว่าด้วยเรื่อง #profile-nav



จัดกึ่งกลางตัวอักษร
#profile-nav {text-align: center;}
ใส่ภาพพื้นหลัง #profile-nav {background-image: url(ภาพพื้นหลัง) ;}

ทำให้พื้นหลังใส
#profile-nav {background: transparent; border: none}

เปลี่ยนสีตัวอักษร
#profile-nav a {color: สีตัวอักษร;}

เปลี่ยนขนาดตัวอักษร
#profile-nav a {font-size: ขนาดตัวอักษรpx; }

ทำให้ตัวแต่ละลิ้งค์ห่างกัน
#profile-nav a {padding: ระยะห่างระหว่างลิ้ง;}

#new_header {background:url(http://img255.imageshack.us/img255/6240/kapook33888qm2.gif) no-repeat; height: 100px}

ขีดเส้นทับ Profile Name

เอาไปใช้กับส่วนอื่น ๆ ก็ได้นะคะ หรือไม่ก็เอาไปใส่ เวลาเม้าส์ชี้ข้อความก็ได้

#profile-name {text-decoration: line-through;}

ลิ้งค์บนสุด Home, My Profile Etc., one by one

ดัดแปลง แล้วก็เปลี่ยนแบบ สี หรือขนาดกรอบ และแบคกราวน์เอาเองนะคะ

อันนี้เป็นตัวอย่างของปุ่ม home นะคะ



#primenu a[name="&lid=HeaderNav_Home"] {background:url(ลิ้งค์รูป url pic);color:#fff;width:200px;height:40px;border:3px double #ff6699; text-align:center;font-family:Felix Titling;font-size:20px}

อันนี้ของลิ้งค์ถัดมาที่เหลือ ด้านหลังพวกโค้ดก็ใช้เหมือนกับข้างบน

ตัวอย่างอีกอัน



#primenu a[name="&lid=HeaderNav_Friends"]
#primenu a[name="&lid=HeaderNav_Groups"]
#primenu a[name="&lid=HeaderNav_MyProfile"]
#primenu a[name="&lid=HeaderNav_Messages"]
อันนี้ถ้าจะทำเป็นภาพนะคะ (แบคกราวน์ส่วนอื่น ๆ ถ้าจะทำให้ใสก็ลองหาดูนะคะ มีบอกไว้แล้ว)

ตัวอย่าง



#primenu a[name="&lid=HeaderNav_Home"] {background:url(ลิ้งค์รูป url pic);color:#e83333;width:140px;height:30px;border:0px double #ff6699; text-align:center;font-family:Felix Titling;text-indent:-9000px}

ถ้าจะเอาออก

อันนี้ตัวอย่าง เอา home ออก



#primenu a[name="&lid=HeaderNav_Home"] {display:none}