โค้ดเปลี่ยนตัวอักษรตรงคอมเม้น
<style type="text/css">
#comment_detail_border div{font-family:"แบบอักษร";font-size:ขนาดpt;}
</style>
โค้ดเมาส์เป็นเครื่องหมายบวก
<style type=text/css>
body {cursor:crosshair;}
</style>
โค้ดซ่อนรูปอัลบั้มไว้หลังรูปอื่น
<style type="text/css">
.album { background:url( urlของรูป );background-repeat:no-repeat; background-position: center center;}
.album:hover {background:url( urlของรูป );}
.album img {filter:alpha(opacity=0);}
.album img:hover {filter:alpha(opacity=100);}
</style>
โค้ดซ่อนรูปFiveไว้หลังรูปอื่น
<style type="text/css">
#user-fives a:hover img {filter:none}
.link_five img {display:none}
.link_five img {margin-top: 5px;}
.link_five {display: block;background: url( urlของรูป ) center center no-repeat;height: ความสูงpx;}
.link_five:hover img {display: block;}
.link_five .listitem-separator {display:none}
</style>
โค้ดเปลี่ยนสีอักษรทั้งหน้าhi5
<style>
td,th,div,li,ul,p {color: โค้ดสี;font-size: ขนาดpx;font-family: 'แบบตัวอักษร';}
body,p {color: โค้ดสี;font-size: ขนาดpx;font-family: 'แบบตัวอักษร';letter-spacing:1px;}
ment,p {color: โค้ดสี;font-size: ขนาดpx;font-family: 'แบบตัวอักษร';letter-spacing:1px;
</style>
โค้ดใส่เอ็ฟเฟคที่เฮด
<style type="text/css">
#profile-name { background-color: transparent; border: none ;
background-color: โค้ดสี ; (*ควรเป็นสีพื้นๆจะได้เห็นเอ็ฟเฟคชัดๆ)
color: #00FF00 ; height: ความสูงpx; width: ความกว้างpx;}
</style>
<style type="text/css">
#profile-name {background-image:url( urlของรูป ); color: #โค้ดสี ;
height: ความสูงpx ; width: ความกว้างpx ;}
</style>
โค้ดใส่BGตรงคอมเม้นต์มี2แบบ
1. ใส่BGเฉพาะข้อความคอมเม้นต์
<style type="text/css">
.subsection .comment-text{border:none;background:url(urlของรูป);}
</style>
2. ใส่BGครอบคลุมทั้งหมดของคอมเม้นต์(รวมชื่อ-วัน-เวลา+รูปคนคอมเม้น)
<style type="text/css">
.section .comment-text{border:none;background:url(urlของรูป);}
</style>
โค้ดเม้าส์เปลี่ยนได้2รูปแบบ
<style type="text/css">
body {cursor: url( urlของเม้าท์เวลาไม่ได้ชี้ลิ้งค์ );}
a {cursor: url( urlของเม้าท์ตอนที่ชี้ลิ้งค์ );}
</style>
<style type="text/css">
.subsection .comment {height:140px !important;}
.subsection .comment:{height:100% !important;overflow-y:auto;}
</style>
ซ่อนรูปเพื่อน คลิกทีโผล่
.friend {height:15px !important; }
.friend:hover {height:100% !important;overflow-y:auto;}
ซ่อนรูปดิสเพลเก่า ใส่รูปดิสเพลใหม่
#user-picture { background: url( ..url รูป.. ); background-position:top center;
background-repeat:no-repeat!important; border:none; }
#user-picture img {visibility: hidden}
#user-picture img { height: 150px;width: 150px; }
scrollbar ย้ายไปอยู่ด้านซ้าย
table {direction:ltr!;} table table table table {direction:rtl!;}
body { direction: rtl!; }
ซ่อนส่วนของ Profile left=ส่วนซ้าย center=ส่วนกลาง right=ส่วนขวา
#xabout-left { visibility: hidden; }
#xabout-center { visibility: hidden; }
#xabout-right { visibility: hidden; }
ชื่อ Profile อยู่ตรงกลาง + หัวข้อใต้ Profile อยู่ตรงกลาง
#profile-nav {text-align: center;}
#profile-name {text-align: center; color:#FFFFFF;}
ตัวอักษรทุกตัวอยู่ตรงกลาง
*ยกเว้น ด้านบนตั้งแต่ใต้ชื่อโปรไฟล์ขึ้นไป
td{text-align:center}
โค้ดใส่รูปข้างล่างเฮด
<style type="text/css">
#user-details .content {background: url( URL ของรูป );}
#user-details{border:none !important;}
#user-details .footer {display:none}
</style>
โค้ดรูปเพื่อนติดกัน
<style type='text/css'>.friend-name {display:none}
.friend-picture,.friend-picture a img { height:100px;width:100px;border:none;margin-left: 0px;position:relative;left:+px;}
.friend {width:100px}
.friend-picture div {margin-left: 0px !important;center no-repeat !important;}
#friends .listitem-separator {display:none}</style>
โค้ดให้ Top friend ติดกัน
<style type="text/css"> .friend-picture{height:100px !important;width:100px!important;
margin-left:0px;border: none 0px; }
.friend-picture img {height:100px !important;width:100px!important;margin-left: 7px} </style>
โค้ด ทำรูป Profile..ให้ใหญ่ขึ้น
<style type="text/css">
#user-picture {visibility: hidden}
#user-picture img {width: ความยาว px; height: ความสูง px}
#picture-links {visibility: transparent}
#about-left { background:url( ใส่URLของรูป ) transparent 60% 10% no-repeat; }
</style>
Scroll Bar
<style type="text/css">
html {
scrollbar-arrow-color: โค้ดสี;
scrollbar-face-color: โค้ดสี;
scrollbar-highlight-color: โค้ดสี;
scrollbar-3dlight-color: โค้ดสี;
scrollbar-shadow-color: โค้ดสี;
scrollbar-darkshadow-color: โค้ดสี;
scrollbar-track-color: โค้ดสี; }
</style>
****เว็ปทำ ScrollBar ***http://iconico.com/CSSScrollbar/
รูปจางแบบเหลี่ยมๆเม้าส์เป็นชี้ปกติ
<style type="text/css">
a:link img { filter: Alpha(Opacity=100, FinishOpacity=0, Style=3, StartX=10, StartY=10, FinishX=0, FinishY=0) }
a:visited img { filter: Alpha(Opacity=100, FinishOpacity=0, Style=3, StartX=10, StartY=10, FinishX=0, FinishY=0) }
a:hover img {filter:none;}
</style>
เปลี่ยนสีลิ้งค์ทั้งเพจ
<style type="text/css">
a:link {text-decoration: none; color:#โค้ดสี}
a:visited {text-decoration: none; color:#โค้ดสี}
a:hover { text-decoration: none; color:#โค้ดสี}
</style>
***a:link =สีของลิ้งค์ทั้งหมด
a:visited =สีลิ้งค์ที่ไปมาแล้ว
a:hover =สีของลิ้งค์ตอนเม้าส์ชี้
ย้ายข้อความคอมเม้นต์มาตรงกลาง
<style type="text/css">
.section .comment-text {
TEXT-ALIGN: center; }
</style>
ขยายรูปตรงคอมเม้นต์
<style type="text/css">
.comment-picture a img {width:100px; height:100px !important;}
.comment-picture {height:100px !important;}
</style>
ใส่รูปแทนเส้นตรงเส้นคั่นคอมเม้นต์
<style type="text/css">
#comments .listitem-separator
{background:url(urlของรูป) top center no-repeat !important;
height: ความสูงของรูป px !important;}
</style>
***ใส่รูปกะสีตรงกล่องเขียนคอมเม้นต์
แบบที่ 1 (พื้นหลังเป็นสี)
<style type="text/css">
textarea {background-color: #โค้ดสีของbackground;
border-style: inset;
color: #โค้ดสีของตัวหนังสือที่พิมพ์;
height: 100px;
width: 350px; }
</style>
แบบที่2 (พื้นหลังเป็นรูป)
<style type="text/css">
textarea {background-image:url(url รูป);
border-style: inset;
color:#โค้ดสีของตัวหนังสือที่พิมพ์;
height: 100px ;
width: 350px ; }
</style>
ใส่กรอบให้คอมเม้นต์
แบบที่1พื้นหลังเป็นสี
<style type="text/css">
.subsection .comment {background-color:#โค้ดสีของพื้นหลัง ;
border:ชนิดของกรอป ขนาดของกรอปpx #โค้ดสีของกรอปคอมเม้นต์ ;
height: 470px; overflow: auto;}
</style>
แบบที่2 พื้นหลังเป็นภาพ
<style type="text/css">
.subsection .comment {background-image:url(url รูป);
border:ชนิดของกรอป ขนาดของกรอปpx #โค้ดสีของกรอปคอมเม้นต์ ;
height: 470px; overflow: auto;}
</style>
*** ชนิดของกรอป
ridge=แบบนูนๆ (เรียกไม่ถูกเหมือนกันแต่สวย)
solid=แบบเส้นเดียว
double=แบบเส้นคู่
dashed=แบบเส้นประ
dotted=แบบเส้นจุด
เปลี่ยนสีตรงปุ่มเพิ่มคอมเม้นต์
<style type="text/css">
input{
color:#โค้ดสีของคำว่าเพิ่มคอมเม้นต์;
border:1px solid #โค้ดสีของกรอป;
background-color:#โค้ดสีของพื้นหลัง;
padding: 0px 3px 0px 3px;}
</style>
ลบเส้นคั่นคอมเม้นต์
<style type="text/css">
.listitem-separator {visibility: hidden;}
</style>
ทำข้อความคอมเม้นต์ให้ห่างกัน
<style type="text/css">
.comment-text { letter-spacing: 3px }
</style>
รูปเป็นขาวดำ เมาส์ชี้ปกติ
<style type="text/css">
a:link img {filter:gray);}
a:visited img{filter:gray();}
a:hover img {filter:none;}
</style>
เม้าส์ชี้ภาพแล้วเป็นขาวดำ
<style type="text/css">
a:link img {filter:none;}
a:visited img {filter:none;}
a:hover img {filter:gray;}
</style>
ม้าส์ชี้ภาพแล้วกลับด้าน
<style type="text/css">
a:hover img {filter:fliph;}
</style>
ใส่ตัวขอ 5
<style type="text/css">
#user-fives .subsection div {width:50px !important}
#user-fives .subsection .listitem-separator {display:block !important}
#user-fives .subsection {background:url(urlของรูป);
background-position:260px;
background-repeat:no-repeat}
</style>
ใส่กรอบรูปตรงเพื่อน
<style type="text/css">
.friend-picture {border-style: ชนิดของกรอป; border:2px;border-color: #โค้ดสีของกรอป;}
</style>
ใส่กรอปรูปเพื่อนที่คอมเม้นต์
<style type="text/css">
.comment-picture {border-style: ชนิดของกรอป; border:2px;border-color: #โค้ดสีของกรอป;}
</style>
เปลี่ยนรูปแถบสถิติ
<style type="text/css">
.vanity-bar div div img,
.vanity-bar div img {display:none;}
.vanity-bar div {background:url(url ของพื้นหลัง) !important;}
.vanity-bar div div {background:url(url ของตัวstatus) !important;}
</style>
ทำำSearch Bar ให้ใส
<style type="text/css">
#p_nav_primary #nav_select {background-image:none;}
#p_nav_header {background:none; border:none; }
div#top_header {background:none; }
#p_nav_primary { background: none; border:none; }
</style>
เอาSearch Bar ออก
<style type="text/css">
#p_nav_header{display:none}
</style>
ย้ายรูปเพื่อนคอมเม้นต์ให้อยู่ตรงกลาง
<style type='text/css'>
.comment-picture {margin-top: 6em; left: 16em;position: relative;}
</style>
ซ่อนข้อความในคอมเม้นต์ เอาเม้าส์ชี้โชว์คอมเม้นต์
<style type="text/css">
.subsection .comment {height:105px !important;}
.subsection .comment:hover {height:100% !important;overflow-y:auto;}
</style>
เปลี่ยนสีเส้นคั่นในคอมเม้นต์
<style type="text/css">
#comments .listitem-separator {background: #โค้ดสีของเส้นคั่น !important;}
</style>
รูป เบลอๆเม้าส์ชี้จะเป็นปกติ
<style type="text/css">
a:link img {filter:blur(add = 0, direction = 225, strength = 10);}
a:visited img {filter:blur(add = 0, direction = 225, strength = 10);}
a:hover img {filter: none}
</style>
เอาเม้าส์ชี้รูปแล้วเบลอ
<style type="text/css">
a:link img {filter:none;}
a:visited img {filter:none;}
a:hover img {filter:blur(add = 0, direction = 225, strength = 10);}
</style>
รูปจางแบบวงกลม เมาส์ชี้ปกติ
<style type="text/css">
a:link img {filter: Alpha(Opacity=100, FinishOpacity=0, Style=2, StartX=20, StartY=40, FinishX=0, FinishY=0)}
a:visited img {filter: Alpha(Opacity=100, FinishOpacity=0, Style=2, StartX=20, StartY=40, FinishX=0, FinishY=0)}
a:hover img {filter:none;}
</style>
เปลี่ยนตัว online now
<style type="text/css">
#online-now-icon
{ background: url(url รูป);
height: สูงpx;width: กว้างpx; _background: none; _filter:
progid:DXImageTransform.Microsoft.AlphaImageLoader(src=3D&#39;urlรูป;)) ;
height: สูงpx;width: กว้างpx;}
#online-now-icon {background-image: url(url รูป);
width: กว้างpx; height: สูงpx;margin: 5px 0px 0px 0px;}
</style>
*ใส่ url ของรูปให้ครบทั้ง 3 ช่อง
ใส่ความกว้างความสูงของรูปให้ตรงกับรุปจริง ไม่งั้นภาพออกมาไม่สวยน้า
เปลี่ยนไอคอนใต้รูปโปรไฟล์ของเรา
<style type="text/css">
#user-links img {display: none}
#user-links a {list-style:url(url ของไอคอน) inside;display:list-item}
</style>
ใส่ขอบให้หน้าเวปเพจ แบบนูนๆ (ridge)
<STYLE>
html
{ border-right: #โค้ดสี 10px ridge;
border-top: #โค้ดสี 10px ridge;
border-left: #โค้ดสี 10px ridge;
border-bottom: #โค้ดสี 10px ridge; }
</STYLE>
ใส่ขอบให้หน้าเวปเพจ แบบเส้นเดียว
<STYLE>
html
{ border-right: #โค้ดสี 20px solid;
border-top: #โค้ดสี 20px solid;
border-left: #โค้ดสี 20px solid;
border-bottom: #โค้ดสี 20px solid; }
</STYLE>
ใส่ขอบให้ทั้งหน้าเวปเพจ แบบเส้นประ
<STYLE>
html
{ border-right: #โค้ดสี 20px dashed;
border-top: #โค้ดสี 20px dashed;
border-left: #โค้ดสี 20px dashed;
border-bottom: #โค้ดสี 20px dashed; }
</STYLE>
ใสขอบให้ทั้งหน้าเวปเพจ แบบจุดๆ
<STYLE>
html
{ BORDER-RIGHT: #โค้ดสี 20px dotted;
BORDER-TOP: #โค้ดสี 20px dotted;
BORDER-LEFT: #โค้ดสี 20px dotted;
BORDER-BOTTOM: #โค้ดสี 20px dotted; }
</STYLE>
ใส่ขอบให้ทั้งหน้าเวปเพจ แบบเส้นคู่
<STYLE>
html
{ BORDER-RIGHT: #โค้ดสี 20px double;
BORDER-TOP: #โค้ดสี 20px double;
BORDER-LEFT: #โค้ดสี 20px double;
BORDER-BOTTOM: #โค้ดสี 20px double; }
</STYLE>
ย้ายรูปโปรไฟล์มาตรงกลาง
<style type='text/css'>
#about-left{position: relative;left: 27.5em;}
#about-right{position: relative;left: -52em;}
#about-center{position: relative;left: 27.5em;}
</style>
ทำตรงส่วน header ต่างๆให้ใส
<style type="text/css">
#profile-nav { background-color: transparent; }
.section h1 { background-color: transparent; border: none; }
.section h2 { background-color: transparent; border: none; }
</style>
ย้ายทุกส่วนของ Hi5 ให้มาอยู่ตรงกลาง
<style type="text/css">
#profile-name {text-align: center}
#profile-nav {text-align: center}
.section h1 {text-align: center}
.section h2 {text-align: center}
.section .content {text-align: center}
</style>
ใส่เส้นขอบให้ส่วนต่างๆ
<style type="text/css">
#user-details {border:5px รูปแบบของขอบ #ใส่โค๊ตสี}
.section .content {border:5px รูปแบบของขอบ #ใส่โค๊ตสี}
</style>
เปลี่ยนสีอักษรตรง search bar
<style type="text/css">
#top_header{color:#ใส่โค๊ตสี!important}
#top_header a.account_link { color: #ใส่โค๊ตสี; }
#top_header a.search_link { color: #ใส่โค๊ตสี; }
#top_header a.search_link_active { color: #ใส่โค๊ตสี; }
#top_header span { color: #ใส่โค๊ตสี !important; }
#p_nav_primary li#nav a { color: #ใส่โค๊ตสี; }
#p_nav_primary li#nav_select a { color: #ใส่โค๊ตสี; }
</style>
รูปเป็นแบบเอ็กซเรย์ เม้าส์ชี้เป็นปกติ
<style type="text/css">
a:link img {filter:xray();} a:visited img {filter:xray();} a:hover img {filter:none;}
</style>
เม้าส์ชี้แล้วรูปเป็นแบบเอ็กซเรย์
<style type="text/css">
a:link img {filter:none;}
a:visited img {filter:none;}
a:hover img {filter:xray();}
</style>
เม้าส์ชี้รูปแล้วรูปแข็งเหมือนหิน
<style type="text/css">
a:link img {filter:none;}
a:visited img {filter:none;}
a:hover img {filter:progid:dximagetransform.microsoft.emboss;}
</style>
รูปแข็งเหมือนหิน เม้าส์ชี้เป็นปกติ
<style type="text/css">
a:link img {filter:progid:dximagetransform.microsoft.emboss;}
a:visited img {filter:progid:dximagetransform.microsoft.emboss;}
a:hover img {filter:none;}
</style>
รูปกลืนไปกับแบล็คกราว เมาส์ชี้เป็นปกติ
<style type="text/css">
a:link img {filter:alpha(opacity=60);}
a:visited img {filter:alpha(opacity=60);}
a:hover img {filter:none;}
</style>
เม้าส์ชี้รูปแล้วรูปกลืนไปกลับแบล็คกราว
<style type="text/css">
a:link img {filter:none;}
a:visited img {filter:none;}
a:hover img {filter:alpha(opacity=60);}
</style>
Hi5กลับด้าน (เพื่อน,five,คอมเม้นต์ อยู่ด้านซ้าย)
<style type="text/css">
table {direction:rtl;} table table table {direction:ltr;}
</style>
พื้นหลังล็อคติด และไม่ทำรูปซ้ำ (เหมาะกะBGเต็มจอ)
<style type="text/css">
body {
background-image: url(URLของรูป) ;
background-attachment:fixed;
background-repeat: no-repeat; }
</style
พื้นหลังล็อคติด และทำรูปซ้ำ (เหมาะกะBGเล็กๆ)
<style type="text/css">
body {
background-image: url(URLของรูป) ;
background-attachment:fixed;
background-repeat:repeat; }
</style>
พื้นหลังเลื่อนตามสกอร์บาร์ และทำรูปซ้ำ (เหมาะกะBGเล็กๆ)
<style type="text/css">
body { background-image: url(URLของรูป) ;
background-attachment:scoll;
background-repeat:repeat; }
</style>
พื้นหลังเลื่อนตามสกอร์บาร์ และไม่ทำรูปซ้ำ (เหมาะกะBGเต็มจอ)
<style type="text/css">
body {
background-image: url(URLของรูป) ;
background-attachment:scoll;
background-repeat: no-repeat; }
</style>
ใส่ปีกให้รูปคอมเม้นต์
<style type="text/css">
.comment {background:url(URL ของรูปปีก); background-position: 59px 50px;background-repeat:no-repeat;}
.comment-picture {MARGIN-TOP: 7.5em; LEFT: 16.6em;POSITION: relative;}
.comment-picture {height:100px!important; width:100px;border:none;}
.comment-picture a img {width:100px;height:100px;border:none;}
</style>
ใส่ปีกให้รูปโปรไฟล์
<style type="text/css">
#user-picture { background-image: url( urlของปีก );
background-repeat: no-repeat;background-position: top center;}
</style>
ใส่รูปแทนปุ่มเพิ่มคอมเม้นต์
<style type="text/css">
input{
color:#โค้ดสีของคำว่าเพิ่มคอมเม้นต์;
border:1px solid #โค้ดสีของกรอป;
background-image:url(url รูป);
padding: 0px 3px 0px 3px;}
</style>
ใส่กรอปให้รูปโปรไฟล์
<style type="text/css">
#user-picture img{border-style:ชนิดของกรอป; border: 1px; border-color: #โค้ดสีของกรอป;}
</style>
ใส่BGให้อัลบั้มรูป
<style type="text/css">
.album {
background: url(Url รูป) top left no-repeat;
height: 120px;
width: 130px;
position: relative;}
</style>
ชี้ลิ้งค์อักษรใหญ่ขึ้น
<style type="text/css">
A:hover { font-variant: small-caps; font-size:16px; font-weight:bold; color:#โค้ดสีของตัวหนังสือที่ใหญ่ขึ้น;}
</style>
ชี้ลิ้งค์แล้วไฮไลท์
<style type="text/css">
a:hover{background:#โค้ดสีของส่วนไฮไลท์;}
</style>
ชี้ลิ้งค์มีกรอป
<style type="text/css">
A:hover {border:1px ชนิดของกรอป #โค้ดสีของกรอป;}
</style>
ชี้ลิ้งค์เรืองแสง //
<style type="text/css">
a:hover{filter:Glow(color=#โค้ดสีของตัวเรืองแสง,strength=4);height:0px;}
</style>
ชี้ลิ้งค์แล้วขึ้นเงาเป็นตัวหนังสือ
<style type="text/css">
a:hover{filter:DropShadow(color=#โค้ดสีของเงา,strength=4);height:0px;}
</style>
ชี้ลิ้งค์มีเงา
<style type="text/css">
a:hover {filter:Shadow(color=#โค้ดสีของเงา,strength=4);height:0px;}
</style>
ชี้ลิ้งค์แล้วเบลอ
<style type="text/css">
a:hover{filter:blur(add="1",direction="360",strength="4"); height:0;}
</style>
ชี้ลิ้งค์แล้วเป็นสีรุ้ง
<style type="text/css">
a:hover {
color:#FFFFFF !important;
text-decoration: none;
background: url(
http://img99.imageshack.us/img99/3043/ranpy5.gif) !important;}
</style>
ชี้ลิ้งค์แล้วเป็นรูป
<style type="text/css">
a:hover {
color:#โค้ดสีตัวหนังสือ !important;
text-decoration: none;
background: url( urlของรูป ) !important;}
</style>
ฝาก hi5 ด้วย น๊า
[/size]
