สังคมของการเรียนรู้ และแบ่งปัน ชอบตกแต่ง โปรไฟล์ Hi5 หน้าเว็ป ด้วยโค๊ด HTML.Java.เชิญทางนี้ครับ more...
ก่อตั้งโดย poneag
กระทู้: รวม 108 Code hi5

 

 

รวม 108 Code hi5

บางโค๊ดสามารถใช็กับโปรไฟล์ของแมสได้

เช่นโค๊ดพื้นหลัง ฯ.ล. ทดลองใช้ดู

 

 



ใส่สกอบาร์ให้hi5

<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>



ย้ายรูปโปรไฟล์มาตรงกลาง


<style type="text/css">

#about-left { position: relative;left: 40%; }

#about-center { position: relative;left: 40%; }

#about-right { position: relative;right:65%; }


</style>




เอาส่วนที่ไม่ต้องการออก

<style type="text/css">

#Quantcast{display:none;}
#user-info {display: none;}
#p_nav_header {display:none;}
#hifi5 {display:none;}
#user-details {display:none;}
#user-fives {display: none;}
#todays-topic {display: none;}
#journal-entries {display: none;}
#journal {display: none;}
#groups {display: none;}
#schools {display: none;}
#videos {display: none;}
#recent-updates {display: none;}
#widgets {display: none;}

</style>


ถ้าใส่ไปหมดนี้มันจะหายหมดเลยนะ - -*

เพราะงั้นเลือกแค่บางอันก็พอคับ อยากเอาส่วนไหนออกก็เลือกเฉพาะส่วนนั้น
อันไหนที่ไม่อยากเอาออกก็ไม่ต้องใส่






ลบ view

<style type="text/css">
.profile-nav .name span {display:none}
</style>





ทำท๊อปเฟรนให่ติดกัน

<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: 6px}

</style>






รุปเพื่อนที่คอมเม้นอยุ่ตรงกลาง


<style type='text/css'>.comment-picture {MARGIN-TOP:
6em; LEFT: 16em;POSITION: relative;}</style>

แบบที่ 1

พื้นหลังล็อกติด
และไม่ทำรูปซ้ำ

<style type="text/css">
body {
background-image: url(http://img.thzhost.com/i/1r/jamer1.jpg) ;
background-attachment:fixed;
background-repeat: no-repeat; }
</style>

ส่วน ใหญ๋ ใชั กับ รูปภาพ BG เต็ม จอ พอ ดี



แบบที่ 2

พื้นหลังล็อกติด
และทำรูปซ้ำ


<style type="text/css">
body {
background-image: url(URLของรูป) ;
background-attachment:fixed;
background-repeat:repeat; }
</style>

ส่วน ใหญ่ ใชั กับ รูปภาพ BG เล็ก ที่ ใช้ หลายๆ รูป จน เต็ม จอ



แบบที่ 3

พื้นหลังเลื่อนตามสกอบาร์
และทำรูปซ้ำ


<style type="text/css">
body {
background-image: url(URLของรูป) ;
background-attachment:scoll;
background-repeat:repeat; }
</style>

ส่วน ใหญ๋ ใชั กับ รูปภาพ BG เต็ม จอ พอ ดี



แบบที่ 4

พื้นหลังเลื่อนตามสกอบาร์
และไม่ทำรูปซ้ำ


<style type="text/css">
body {
background-image: url(URLของรูป) ;
background-attachment:scoll;
background-repeat: no-repeat; }
</style>

ส่วน ใหญ่ ใชั กับ รูปภาพ BG เล็ก ที่ ใช้ หลายๆ รูป จน เต็ม จอ




โค้ด ลบเส้นขอบ บลอคต่างๆ

<style type="text/css">
#user-details { border: none; }
.section .content { border: none; }
</style>




โค้ด ใส่เส้นขอบให้บลอคต่างๆ


<style type="text/css">
#user-details {border:5px double :#ใส่โค๊ตสี}
.section .content {border:5px double #ใส่โค๊ตสี}
</style>

ส้ม = เปลี่ยน ได้ ตาม ใจ ชอบ นะ

double = เส้นคู่
dotted = เส้นจุดประๆ
solid = เส้นตรงเรียบกริ๊บ!




--------------------  Search Bar -------------------



โค้ดเปลี่ยนสีตัวอักษรช่วง 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>




ลบแถบlog

<style type="text/css"> #p_nav_header{display:none}</style>






รูป ต่างๆ



โค้ด เปลี่ยนรูป Display ของเราให้ใหญ่ขึ้น


<style type="text/css">
#user-picture img {height: 180px !important;
width: 130px;visibility: hidden;}
#about-left {background:url( ใส่ URL ของรูปภาพ ) no-repeat 50% 0%;} }
 </style>



โค้ดเปลี่ยนรูป Display อยู่ตรงกลาง

<style type='text/css'>
#about-left{position: relative;left: 30em;}#about-right{position: relative;left: -52em;}#about-center{position: relative;left: 32em;}
</style>




โค้ดเปลี่ยนรูปช่วง Comment ให้ใหญ่ขึ้น


<style type="text/css">
.comment-picture {height:100px!important;
width:100px;border:solid #000000 1px;} .comment-picture a img {width:100px;height:100px;}
</style>




โค้ด เปลี่ยนรูป Top Friend ให้ใหญ่

<style type="text/css">
.friend-picture{height:100px !important;width:85px!important;
margin-left:0px;border:solid #000000 1px; } .friend-picture img {height:100px !important;width:100px!important;margin-left: 7px}
</style>





double = เส้นคู่
dotted = เส้นจุดประๆ
solid = เส้นตรงเรียบกริ๊บ!




โค้ดเปลี่ยนรูปทุกรูปใน page มีหลายแบบลองไปใช้ดูคับ


แบบที่ 1 page เบลอๆ

<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>



แบบที่ 2 จะเปลี่ยนเป็นสีเทา

<style type="text/css">
 a:link img {filter:none;}
a:visited img {filter:none;} a:hover img {filter:gray;}
</style>



แบบที่ 3 ด้านซ้ายไปขวา จากขวาไปซ้าย

<style type="text/css">
a:hover img {filter:fliph;}
</style>



แบบที่ 4 อันนี้ต้องลองเอง

<style type="text/css">
a:link img {filter:xray();} a:visited img {filter:xray();} a:hover img {filter:none;}
</style>



แบบที่ 5 page ใส

<style type="text/css">
a:link img {filter:alpha(opacity=60);} a:visited img {filter:alpha(opacity=60);} a:hover img {filter:none;}
</style>



แบบที่ 6 ขาวดำ

 <style type="text/css">
a:link img {filter:gray;} a:visited img {filter:gray;} a:hover img {filter:none;}
</style>



แบบที่ 7 เหมือน หิน
<style type="text/css"> a:link img {filter:none;} a:visited img {filter:none;} a:hover img {filter:progid:dximagetransform.microsoft.emboss;} </style>




ลองดูนะ

<style> td,th,div,body,li,ul,p {
color: #999999;
font-size:8pt;
font-family: ''MS Sans Serif'', ''Microsoft Sans Serif'',sans-serif;
} </style><style>A:link{color:#8F8F8F;text-decoration:none;}
A:visited{color:#999999;text-decoration:none}
A:hover{color:#999999;text-decoration: none;}</style><style> a:link img {filter:gray;}
a:visited img {filter:gray;}
a:hover img {filter:;} </style>



           คลืกลิงค์แล้วมีแรเงาที่ลิงค์

 วางโค้ดที่ ส่วนของเฮด

 <script>
function highlight(which,color){
if (document.all)
which.style.backgroundColor=color
}
</script>


วางโค้ดที่ส่วนของบอดี้

 
     <a href="linkลิงค์เวป" target="_blank" onmouseover="highlight(this,'โค๊ดสี')" onmouseout="highlight(this,'')">เขียนข้อความ</a><br />
<a href="http://www.zalim-code.com/CodeGifdiary.html" target="_blank" onmouseover="highlight(this,'โค๊ดสี')" onmouseout="highlight(this,'')">พิมพ์ข้อความ
</a>





โค้ด ที่เปลี่ยนไอคอนใต้รูป Display ของเรา

<style type="text/css">
#user-links img {display: none}
#user-links a {list-style:url(ใส่ URL ของรูป ) inside;display:list-item}
</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&amp;#39;
  ใส่ URLของรูป ;)) ;height: ใส่ความสูง px;width: ใส่ความยาว px;}
#online-now-icon {background-image: url( ใส่URLของรูป );
width: ใส่ความยาว px; height: ใส่ความสูง px;margin: 5px 0px 0px 0px;}
</style>




--------------------- ส่วน ของ Comment  ------------------

แถบเลื่อนในคอมเม้นอ่าน๊า


<style type="text/css">

BODY {
scrollbar-3dlight-color: #FFFFCC;
scrollbar-track-color: #FF6699;
scrollbar-base-color:#FF6699 ;
scrollbar-arrow-color: #543E5E;
scrollbar-darkshadow-color:#543E5E;
scrollbar-face-color:#FFFFCC;
scrollbar-highlight-color:#FF6699;
scrollbar-shadow-color:#543E5E; }

</style>


โค้ด รูปในกล่องคอมเม้น

<style type="text/css">
textarea {background-image:url(  Url ของรูป );
border-style: inset;
color:  สีของตัวอักษรเวลาพิมในกล่อง ;
height: ความสูง px ;
width: ความยาว  px ; }
</style>


โค้ดทำกรอบให้คอมเม้ม


<style type="text/css">
.subsection .comment {background: url( ใส่ URL รูปภาพ );
border: inset 3px #ใส่โค๊ตสี ;
height: ความสูง px; overflow: auto;}
</style>


ส้ม = เส้นกรอบคอมเม้ม

double = เส้นคู่
dotted = เส้นจุดประๆ
solid = เส้นตรงเรียบกริ๊บ!




โค้ด รูป เพื่อนcomment อยู่ตรงกลาง

<style type='text/css'>
.comment-picture {MARGIN-TOP: 6em; LEFT: 16em;POSITION: relative;}
</style>




โค้ด สลับ  ย้ายคอมเม้นท์มาด้านซ้าย (รวมทั้งลิตเพื่อนและอัลบั้มภาพ)

<style type=text/css>
table {direction:rtl;} table table table {direction:ltr;}
</style>




โค้ด: Hidden ข้อความใน Comment / เอา เมาส์ ชี้ Show Comment


<style type="text/css">
.subsection .comment {height:105px !important;}
.subsection .comment:hover {height:100% !important;overflow-y:auto;}
</style>


โค้ด ลบเส้นคั่นใน Comment

<style type="text/css">
.listitem-separator {visibility: hidden;}
</style>





โค้ด เปลี่ยนสีเส้นคั่น Comment


<style type="text/css">
#comments .listitem-separator {background: # ใส่โค๊ตสี !important;}
</style>




โค้ดย้าย(เฉพาะรูป)คอมเม้นท์


<style type="text/css">
.comment-picture img { float: right; }
.comment-picture a img { float: right; }
</style>



โค้ด ตัวหนังสือใน comment

<style type='text/css'>
.section .comment-text {
TEXT-ALIGN: left ;
line-height: 15pt;
color:  #ใส่โค๊ตสี;
filter: glow(color= #ใส่โค๊ตสี, strength=5)
}
</style>


ส้ม ตำแหน่ง ของ คอม เม้ม

left (ซ้าย)  / center (กลาง)  / right (ขวา)





----------------------- แถบ สถิติ ---------------------




โค้ด เปลี่ยนแถบสีแสดง สถิติ

<style type="text/css">
.vanity-bar div {background:url(http://image.dek-d.com/9/783888/11753869.gif) !important;}
.vanity-bar div div {background:url(http://image.dek-d.com/9/783888/11753859.gif) !important;}
.vanity-bar div div img,.vanity-bar div img
{display:none;}
 </style>


url รูปภาพลองไปใช้ดู

http://image.dek-d.com/9/783888/11753865.gif

http://image.dek-d.com/9/783888/11753867.gif

http://image.dek-d.com/9/783888/11753869.gif

http://image.dek-d.com/9/783888/11753861.gif

http://image.dek-d.com/9/783888/11753859.gif




----------------------  header (กอบอันบน) ----------------



โค้ดปลี่ยน header (กอบอันบน)


- header หลัก อันแรก

<style type="text/css">
#profile-name {background-image:url(http://img.thzhost.com/i/2f/newsssjjaa.jpg);
background-repeat:no-repeat;
color:#โค๊ตสี ตัวหนังสือ ;
height: 500 px;
width: 956 px;}
#profile-nav { background-color: #โค๊ตสี BG อัน ล่าง ; }
</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>




- ใส่รูปภาพให้กับ header ส่วน อื่นๆ


<style type="text/css">
.section h1 { background-color: transparent; border: ขนาดของเส้น px แบบของเส้นขอบ #โค๊ตสีของเส้นรอบ;
background-image:url(Url รูปภาพ);
color: #สีตัวอักษรชื่อตาม header;
background-repeat:repeat;
height: แล้วแต่ px ;
width: แล้วแต่ px ;}
.section h2 { background-color: transparent; border:none;}
</style>

ส้ม = แบบของเส้นขอบ

double = เส้นคู่
dotted = เส้นจุดประๆ
solid = เส้นตรงเรียบกริ๊บ!



โค้ดปิดเส้นขอบและพื้นหลัง

<style type="text/css">
#profile-nav,.section h1,.section h2
{ background-color: transparent; border: none; }
 </style>


โค้ด สำหรับชี้ลิ้งค์แล้วเปลี่ยน


- เป็นจุดสีชมพูวิบวับๆ

<style type="text/css">
a:hover{background: url('http://www.ayw102.th.gs/web-a/yw102/hi5/12.gif'); }
</style>



- ไฮไลท์แว๊บๆ - แดง

<style type="text/css">
a:hover{background: url('http://www.ayw102.th.gs/web-a/yw102/hi5/16.gif'); }
</style>



- ไฮไลท์แว๊บๆ - ดำ

<style type="text/css">
a:hover{background: url('http://www.ayw102.th.gs/web-a/yw102/hi5/17.gif '); }
</style>



- ไฟลุกขึ้นมา

<style type="text/css">
a:hover{background: url('http://www.ladylony.com/xox1.gif'); }
</style>





-------------------  Five  --------------------



Code : ใส่รูปขอ Five นะงับ

<style type="text/css">
#user-fives .subsection div {width:45px !important}
#user-fives .subsection .listitem-separator {display:block !important}
#user-fives .subsection {background:url( URLของรูปภาพ );
background-position:225px;
background-repeat:no-repeat
</style>




------------------------  ส่วน ประ กอบ อื่นๆ  ------------------------



โค้ดใส่กรอบให้หน้าเวป


มีทั้งหมด 4 แบบอ่ะ สามารถเปลี่ยนสีได้ตามใจชอบคับ

จะใส่ต่างกันทั้ง 4 ด้านก็ได้


แบบที่ 1

<STYLE>     
html   
{  BORDER-RIGHT: #ใส่โค๊ตสี 12px ridge;
BORDER-TOP: #ใส่โค๊ตสี    12px   ridge;   
BORDER-LEFT: #ใส่โค๊ตสี    12px ridge;
BORDER-BOTTOM: #ใส่โค๊ตสี   12px ridge }   
</STYLE>



แบบที่ 2

<STYLE>     
html   
{  BORDER-RIGHT: #ใส่โค๊ตสี  12px solid;
BORDER-TOP: #ใส่โค๊ตสี    12px   solid;   
BORDER-LEFT: #ใส่โค๊ตสี    12px solid;
BORDER-BOTTOM: #ใส่โค๊ตสี  12px solid;}   
</STYLE>



แบบที่ 3

<STYLE>     
html   
{  BORDER-RIGHT: #ใส่โค๊ตสี  12px  dotted;
BORDER-TOP: #ใส่โค๊ตสี  12px   dotted;   
BORDER-LEFT: #ใส่โค๊ตสี    12px dotted;
BORDER-BOTTOM: #ใส่โค๊ตสี  12px dotted;}   
</STYLE>



Code : เพิ่ม Top Friend อีก อัน (เอา ไป วาง ใน ช่อง Lifestyle หรือ
Interests ก็ได้น๊ะ คับ )


<style type="text/css">
<!--
.style11 {font-size: 12; }
-->
</style>
<table width="452">
  <tr>
    <th widt" scope="col"><a href=" ลิ้งคนที่1 " target="_blank">ชื่อคนที่1[/url]

        <a href="ลิ้งคนที่1" target="_blank"><img src="รูปคนที่1" width="80" height="100" border="0">[/url]

    <a href=" ลิ้งคนที่1 " target="_blank">[/url]</p>    </th>

    <th width="113" scope="col"><a href=" ลิ้งคนที่2 "target="_blank"> ชื่อคนที่2 [/url]

      <a href=" ลิ้งคนที่2 " target="_blank"><img src=" รูปคนที่2 " width="80" height="100" border="0">[/url]</th>

    <th width="113" scope="col"><span class="style11"><a href=" ลิ้งคนที่3 " target="_blank">ชื่อคนที่3[/url]
    <a href=" ลิ้งคนที่3 " target="_blank"><img src=" รูปคนที่3 " width="80" height="100" border="0">[/url]

    </span></th>
   
    <th width="113" scope="col"><span class="style11"><a href=" ลิ้งคนที่4 " target="_blank">ชื่อคน4[/url]

     <a href=" ลิ้งคนที่4 " target="_blank"><img src=" รูปคนที่4 " width="80" height="100" border="0">[/url]</span></th>
     
     <th width="113" scope="col"><span class="style11"><a href=" ลิ้งคนที่5 " target="_blank">ชื่อคน5[/url]

      <a href=" ลิ้งคนที่5 " target="_blank"><img src=" รูปคนที่5 " width="80" height="100" border="0">[/url]</span></th>
  </tr>
  <tr>
</tr>






นี่สำหลับตัวหนังสือวิ่งงับ

<marquee direction="up">พิมพ์ข้อความที่นี่</marquee>  ****ข้อความเลื่อนขึ้น

<marquee direction="down">พิมพ์ข้อความที่นี่</marquee> ***ข้อความเลื่อนลง

<marquee direction="up" behavior="alternate">พิมพ์ข้อความที่นี่</marquee>**** ข้อความเลื่อนขึ้นลง

<marquee behavior="alternate" direction="up" width="80%"><marquee direction="right">พิมพ์ข้อความที่นี่</marquee></marquee>********ข้อความซิกแซก

<marquee behavior="alternate" direction="up" width="80%"><marquee direction="right" behavior="alternate">พิมพ์ข้อความที่นี่</marquee></marquee> *******ข้อความซิกแซกไปมา

<marquee style="border:BLUE 2px SOLID">พิมพ์ข้อความที่นี่</marquee>  ข้อความวิ่งในกรอบสี่เหลี่ยม



โค้ดแต่ง Content คือข้อมูลส่วนตัว

<style type="text/css">

#user-details .content { direction: RtL;}
#about-left { direction: LtR; }
#about-center{ direction: LtR; }
#about-right { direction: LtR; }
#about-left, #about-center, #about-right
{ border: outset #1c1c1c 10px; }

</style>



Code ใส่ Footer ด้านล่างอ่ะ

<style type="text/css">
#footer {
background: url(ใส่ URL รูปภาพ) no-repeat center center;
border: none; display: block; height: 50px;
}
#footer *,#footer a,#ad_banner {display: none;}
</style>


โค้ดลบส่วนต่างๆงับป๋ม

<style type="text/css">
#schools {display:none;}
#groups {display:none;}
#videos {display:none;}
#widgets {display:none;}
#background {display:none;}
#about-center {display:none}
#.............
</style>




#schools {display:none;}

#groups {display:none;}

#videos {display:none;}

#widgets {display:none;}

#background {display:none;}

#recent-updates {display:none;}

#Interests {display:none;}

#journalDetail {display: none;}

#photoAlbums {display: none;}

#friends {display: none;}

#common-friends {display:none;}

#user-fives {display: none;}

#about-left {display:none} ช่องที่มีรูปดิสเพลย์

#about-center {display:none} ช่องกลาง

#about-right {display:none} ช่องแถบสถิต

#journal-entries a.view-all {display:none} ลบลิ้งรายการสมุดบันทึก

#journal-entries h4 a {display:none} ลบลิ้ง View all ,Compose

#journal-entries h4 {display:none} ลบคำว่าJournal หรือ สมุดบันทึก

#hi5urlspan #newURL a {display:none} ลบลิ้ง Send it to...

#hi5urlspan #newURL {display:none} ลบตัวอักษรในบล้อก URL

#journal-entries {display:none} ลบบล้อกของ Journal หรือ สมุดบันทึก

#abuse-links a {display:none} ลบลิ้ง block user และ Report abuse ใต้รูปดีเพลย์

#todays-topic strong {display:none} ลบคำว่า Status:

#xabout-center span {display:none} ลบคำว่า Online Now

#todays-topic {display:none} ลบคำว่า Status: รวมข้อความ Topic

#todays-topic a {display:none} ลบคำว่าแก้ไขสถานะ หรือ Edit your status...

#user-info {display:none} ลบกล่องข้อมูลส่วนตัวตั้งแต่ อายุ-โรงเรียน

#user-info h4 {display:none} ลบหัวข้อ อายุ-โรงเรียน

#about-center nobr {display:none} ลบลิ้ง more about me...

#user-details { border: none; } ลบเส้นขอบ บลอคต่างๆ

#user-details .content {display:none} ลบกล่องข้อมูลส่วนตัวออกให้หมด

#p_nav_header{display:none} ลบ แถบ Log In , Search Bar

#profile-nav { background-color: transparent; } Header ใส

#profile-nav a {display:none;} ลบ Link ใต้ Head

.profile-nav .name span {display:none} ลบ View

.listitem-separator {visibility: hidden;} ลบเส้นคั่นระหว่าง Comment

.section .content { border: none; } ลบเส้นขอบ บลอคต่างๆ

.comment div {visibility: hidden} ลบ ชื่อ กับ วัน เวลา ที่ คอมเมนท์

.section h1 { background-color: transparent; border: none; } Header ใส

.section h2 { background-color: transparent; border: none; } Header ใส

.box_profile_connections {display:none!important} *ลบช่องว่างตรง Search Bar กับ Profile
*ใช้คู่กัน
.profile-nav {margin: 0 0 10px 0; padding: 0px 0 0 0!important;} *ลบช่องว่างตรง Search Bar กับ Profile


ลบอัพเดท
<style type='text/css'>

#recent-updates {display:none;}

</style>


ทุกอย่างอยู่ตรงกลาง ตั้งแต่ About Me ถึง Comment อยู่ตรงกลางทั้งหมดไม่ได้ลบอะไรออกเลย
<style type='text/css'>

#footer {display:none}

#col1 {position:relative;top: 0em!;left: 20.3em!;}

#col2 {position:relative;top: 70em!;left: -20.3em!;}

</style>


ลบดูข้อมูลทั้งหมด
#comments h2 { display: none; }


ซ่อนคอมเม้น
.subsection .comment {height:100px !important; }

.subsection .comment:hover {height:100% !important;overflow-y:auto;}




แบล็คกาวพื้นหลังเพื่อน
.friend { background:#ff0000 none; filter:alpha(opacity=70);}




อธิบายไม่ถูกต้องลอง
.section h1 {text-align:center;background:#000;Filter: Alpha(Opacity=100);color:#fff;boder:none}

.section h2 {text-align:center;background:#000;Filter: Alpha(Opacity=70);color:#fff;boder:none}

.section h3 {text-align:center;background:#000;Filter: Alpha(Opacity=70);color:#fff:border:none}

.section h4 {text-align:center;background:#000;Filter: Alpha(Opacity=70);color:#fff;boder:none}

.section h1:hover {background:#000;Filter: Alpha(Opacity=70)}




เปลี่ยนสี scrollbar ในกล่องคอมเม้น
<style>

textarea {
scrollbar-direction: ltr;
scrollbar-face-color: #fff;
scrollbar-shadow-color: #000;
scrollbar-highlight-color: #000;
scrollbar-3dlight-color: #000;
scrollbar-darkshadow-color: #000;
scrollbar-track-color: #000;}

</style>





กล่องคอมเม้นใส + ปุ่มคอมเม้นใส

.commentEditor form input {
    background: transparent url(http://v3.pic2us.com/pic/6/6b32296352f083b37cc15bc13bd75cec.jpg) center center no-repeat;
    color: #FFFFFF;
    overflow: hidden;
    width: 123px;
    height: 38px;
    padding: 0; margin: 0; border: 0;
    text-indent: -9999px;
    line-height: 9999px;
    cursor:pointer; filter:alpha(opacity=70);}

<style>

textarea {background-image:url(http://v3.pic2us.com/pic/1/1d35172320f812aa291834c00e411900.jpg);
border: solid 0px #000000; font-Arial: small-caps; font-size:20px; font-weight:bolder;
color:#FFFFFF;
height: 200px;
width: 450px; filter:alpha(opacity=70);}

</style>




ลบหัวข้อโปรแกรมฝั่งคอมเม้น
#col2_14-0-5 {display:none}




ฝั่งคอมเม้นเอียงซ้ายแก้ได้โดยใช้
#col2 {margin-left:42px!;}





ทำภาพคอมเม้นตะเคงข้างคลิกกลับปกติ 0=ปิดใช้งาน 1=เปิดใช้งาน <grayscale=0, xray=0, mirror=0, invert=0, opacity=1>
.comment-picture{filter:progid:DXImageTransform.Microsoft.BasicImage(grayscale=0, xray=0, mirror=0, invert=0, opacity=1, rotation=3)}
.comment-picture:hover{filter:none}





ทำภาพคอมเม้นเซ็นเซอร์คลิกกลับปกติ
.comment-picture{filter:progid:DXImageTransform.Microsoft.Pixelate(maxsquare=5)}
.comment-picture:hover{filter:none}




ทำภาพเพื่อนเซ็นเซอร์คลิกกลับปกติ
<style>
.friend-picture{filter:progid:DXImageTransform.Microsoft.Pixelate(maxsquare=5)}
.friend-picture:hover{filter:none}
</style>




ใส่รูปหลัง Five คลิกแล้วเป็นเหมือนเดิม

#user-fives a:hover img {filter:none}

.link_five img {display:none}

.link_five img {margin-top: 5px;}

.link_five {display: block;background: url( ..รูป.. ) center center no-repeat;height: 50px;}

.link_five img { boder:none;}

.link_five:hover img {display: block;}

.link_five .listitem-separator {display:none}




หัวข้อต่างๆ อยู่ตรงกลาง และ เว้นระยะตัวอักษร

.section h1, .section h2, .section h3, .section h4   {text-align: center;letter-spacing: 2px;color:#FF0000;}




ทำภาพเพื่อน Alpha2ชั้น คลิกแล้วกลับเหมือนเดิม
<style>

.friend-picture {Filter: Alpha(Opacity=130, FinishOpacity=0, Style=3, StartX=20, StartY=40, FinishX=0, FinishY=0) Filter: Blur(Add = 5, Direction = 135, Strength = 18);}

.friend-picture div {Filter: Alpha(Opacity=130, FinishOpacity=0, Style=3, StartX=20, StartY=40, FinishX=0, FinishY=0) Filter: Blur(Add = 5, Direction = 135, Strength = 18);}

.friend-picture:hover {filter:none;}
.friend-picture div:hover {filter:none;}

</style>




เงาตัวอักษรช่องโปรไฟล์

#about-left{filter:shadow(color:red);}
#about-center{filter:shadow(color:green);}
#about-right{filter:shadow(color:yellow);}




ทุกอย่างอยู่ตรงกลาง ตั้งแต่ About Me ถึง Comment อยู่ตรงกลางทั้งหมดไม่ได้ลบอะไรออกเลย (ไม่สอนน่ะครับ)
<style type='text/css'>

#footer {display:none}

#col1 {position:relative;top: 0em!;left: 20.3em!;}

#col2 {position:relative;top: 70em!;left: -20.3em!;}

</style>




ลบคำว่าโปรไฟล์ของฉัน ที่อยู่ตรงกลางระหว่างชื่อ กับ จำนวนview

.section-name { display:none;}




ปรับตัวขนาดอักษร ชื่อคนมาคอมเม้น สี วันที่ เวลา font

.comment div { font-Comic Sans: small-caps; font-size:10px; font-weight:bolder;
color:#FFFFFF;border:none; }




ปรับตัวขนาดอักษร สี ระยะห่างข้อความ font ข้อความคอมเม้น

.section .comment-text { line-height: 24pt;
font-Comic Sans: small-caps; font-size:18px; font-weight:bolder;
color:#FFFFFF;border:none; }




ลบแจ้งผู้ใช้กระทำผิด

#abuse-links { display:none; }




ลบเส้นคั่นตรงคอมเม้น

#comments h3 { border: none; }




ลบดูข้อมูลทั้งหมด

#comments h2 { display: none; }




ลบเพื่อนที่มีเหมือนกัน

#common-friends { display:none; }




ลิ้งใต้รูปดิสเพล

#user-links { display:none; }




ลบอัพโหลดรูปภาพ!> เส้นคั่นใต้รูปดิสเพล

#picture-links { display:none; }

.subsection-separator { display:none; }




ลบส่งไปให้เพื่อนของคุณ

.blacktxt { display:none; }




ลบ url ของเรา

#newURL { display:none; }




ลบหัวข้อรายละเอียดส่วนตัว

.box_profile_info_small_heading { display:none; }




เพิ่มระยะห่างของช่องตรง xabout-right

.subsection .vanity-title  { font-size:18px }




ลบข้อมูลผู้ติดต่อ

#contact-info {display:none;}




ลบ ดูเพื่อน เพื่อนโปรด แวดวงเพื่อน

#friends h2 { display:none; }




ซ่อนรูปเพื่อน คลิกทีโผล่

.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!; }




เว้นระยะห่างตัวอักษรทั้งหน้า ( หรือลบ html ใส่หัวข้ออื่นแทนก็ได้ )

html { letter-spacing: 2px; }




ซ่อนส่วนของ Profile left=ส่วนซ้าย center=ส่วนกลาง right=ส่วนขวา

#xabout-left { visibility: hidden; }
#xabout-center { visibility: hidden; }
#xabout-right { visibility: hidden; }




เมาส์ cursor รูป +
html { cursor: crosshair; }




ชิ้ลิ้งแล้วตัวอักษรใหญ่
A:hover { font-Comic Sans: small-caps; font-size:16px; font-weight:bolder; color:#FFFFFF;}




ชื่อ Profile อยู่ตรงกลาง + หัวข้อใต้ Profile อยู่ตรงกลาง

#profile-nav {text-align: center;}

#profile-name {text-align: center; color:#FFFFFF;}




ตัวอักษรทุกตัวอยู่ตรงกลาง *ยกเว้น ด้านบนตั้งแต่ใต้ชื่อโปรไฟล์ขึ้นไป
td{text-align:center}




ทำเพื่อนแนวตั้ง 1.ปิดส่วนที่ดูเพื่อน 2.ปรับความห่างของรูป 3.ปรับตำแหน่ง กว้าง สูง

#friends h2 { display:none; }

.friend { height:100px!; }

#friends { width: 100px!; margin-top:0px!; margin-left:0px!; height:700px!; }




ลบข้อมูลฝั่งซ้าย ฝั่งขวามาอยู่ตรงกลางทั้งหมด

#col1 {display: none;}
table { empty-cells: hidden; }
.bg_content table tbody tr td { width: 100%; }
#col2 { padding-left:250px; padding-right:250px; }


ลบข้อมูลฝั่งขวา ฝั่งซ้ายมาอยู่ตรงกลางทั้งหมด

#col2 {display: none;}
table { empty-cells: hidden; }
.bg_content table tbody tr td { width: 100%; }
#col1 { padding-left:250px; padding-right:250px; }




วิธีซ่อนข้อความใน about me หรือ interests
เอาไปใส่ใน http://hi5.com/friend/account/displayEditProfileCustomization.do
#Viva:hover {height:100% !important;overflow-y:auto;}
#Viva {width: 500px;height: 39px;overflow: hidden;}

เอาไปใส่ในช่อง Lifestyle หรือ Interests
<div id="Viva" align="center">  TEXT or IMG </div>

โพสต์โดย
poneag

6 มี.ค. 55 เวลา 14:34 488