กระดานสนทนา social network หาเพื่อน แชท Hi5 Facebook Twitter Blackberry Myspace Multiply MSN

ไปที่เนื้อหา

ธีม Multiply สีดำ เรียบหรู

พูดคุยเกี่ยวกับ Multiply
ตอบกระทู้

ธีม Multiply สีดำ เรียบหรู

โพสต์โดย admin » อาทิตย์ ส.ค. 29, 2010 7:51 pm

ส่งท้ายปี 2008 ด้วย CSS ที่ทำขึ้นมาเฉพาะจากเดิมที่ทำ CSS สำหรับใช้กับธีม Avlack ก็เปลี่ยนมาทำ CSS สำหรับใช้กับธีม blacklily ดูบ้างครับ เพื่อให้เพื่อนๆ ที่ใช้ธีมอันอื่น ได้นำไปใช้เพิ่มความหลากหลายครับ

CSS อันนี้เน้นสีโทนเทาดำ และสีฟ้า อาจมีสีอื่นเป็นข้อความอีกเล็กน้อย


Model : Arthur
Photographer : Andrew (http://lulubu.multiply.com)
Template Design : Samarn (http://samarn.multiply.com)
CSS : Samarn (http://samarn.multiply.com)


เริ่ม ต้นการนำ CSS นี้ไปใช้ ให้ออกแบบธีมของตนเองก่อน จะได้เป็นเอกลักษณ์ไม่ซ้ำใคร จากนั้นก็อัพโหลดรูปภาพที่ออกแบบขึ้นอินเตอร์เน็ต นำ URL ของรูปภาพที่อัพโหลด มาใส่ใน CSS (อาจจะอธิบายซ้ำๆ หลายบทความเพราะเพื่อนๆบ้างคนพึ่งจะเล่นมัลติพลาย และยังอาจจะไม่เคยอ่านบทความเก่าๆ เลยขออธิบายซ้ำๆ อีกหลายๆ รอบครับ....)

รูปภาพ


วิธีใส่ไปที่ Customize My Site > Custom CSS

โค้ด: เลือกทั้งหมด
BODY { MARGIN-TOP: 0px; BACKGROUND: #252728 top; WIDTH: auto; COLOR: #ccc}

textarea { BACKGROUND: #0D0C0C; color:#FFFFFF; border : 1px solid #222222 ;}

input { border : 1px solid #CCCCCC ; background : #000000; color:#FFFFFF;}

DIV.contentwrapper {BACKGROUND: none transparent scroll repeat 0% 0%}

DIV.bodywrap {BACKGROUND: none transparent scroll repeat 0% 0%}

DIV.header H3 {MARGIN: 0px; COLOR: #000000}

IMG#multiply_logo_anon {WIDTH: 55px}

TABLE.globalnav { BACKGROUND: url(http://www.travel-is.com/samarn/arthur-top2.jpg) no-repeat left top; WIDTH: 100%; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; HEIGHT: 70px; BORDER-BOTTOM-STYLE: none}

DIV.header { PADDING-RIGHT: 10px; BACKGROUND: #000000; MARGIN: 0px; OVERFLOW: visible; HEIGHT: 70px}

DIV.owner_nav {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; BACKGROUND: url(http://www.travel-is.com/samarn/arthur-header2.jpg) #000000 no-repeat left top; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; HEIGHT: 574px}

H1#page_owner_title { PADDING-RIGHT: 0px; PADDING-LEFT: 20px; FONT-WEIGHT: normal; FONT-SIZE: 18px; BACKGROUND: none transparent scroll repeat 0% 0%; PADDING-BOTTOM: 0px; COLOR: #ffffff; BORDER-TOP-STYLE: none; PADDING-TOP: 510px; FONT-FAMILY: serif; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; HEIGHT: 30px; BORDER-BOTTOM-STYLE: none}

DIV#subnavc {BACKGROUND: none transparent scroll repeat 0% 0%; MARGIN-LEFT: 0px; WIDTH: auto; BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none}

DIV#subnav {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: auto; PADDING-TOP: 0px; HEIGHT: auto; BACKGROUND-COLOR: #14181a}

A.topt {PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 10px; FONT-WEIGHT: bold; FONT-SIZE: 20px; BACKGROUND: none transparent scroll repeat 0% 0%; FLOAT: left; PADDING-BOTTOM: 5px; WIDTH: auto; COLOR: #77BDC9; BORDER-TOP-STYLE: none; LINE-HEIGHT: 1.2em; PADDING-TOP: 5px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; HEIGHT: auto; TEXT-ALIGN: center; BORDER-BOTTOM-STYLE: none}

A.topt:visited {PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 10px; FONT-WEIGHT: bold; FONT-SIZE: 20px; BACKGROUND: none transparent scroll repeat 0% 0%; FLOAT: left; PADDING-BOTTOM: 5px; WIDTH: auto; COLOR: #77BDC9; BORDER-TOP-STYLE: none; LINE-HEIGHT: 1.2em; PADDING-TOP: 5px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; HEIGHT: auto; TEXT-ALIGN: center; BORDER-BOTTOM-STYLE: none}

A.topt:link {PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 10px; FONT-WEIGHT: bold; FONT-SIZE: 20px; BACKGROUND: none transparent scroll repeat 0% 0%; FLOAT: left; PADDING-BOTTOM: 5px; WIDTH: auto; COLOR: #77BDC9; BORDER-TOP-STYLE: none; LINE-HEIGHT: 1.2em; PADDING-TOP: 5px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; HEIGHT: auto; TEXT-ALIGN: center; BORDER-BOTTOM-STYLE: none}

A.toptsel {PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 10px; FONT-WEIGHT: bold; FONT-SIZE: 20px; BACKGROUND: none transparent scroll repeat 0% 0%; FLOAT: left; PADDING-BOTTOM: 5px; COLOR: #ffffff; BORDER-TOP-STYLE: none; PADDING-TOP: 5px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; TEXT-ALIGN: center; BORDER-BOTTOM-STYLE: none; line-: 1.2em}

A.toptsel:visited {PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 10px; FONT-WEIGHT: bold; FONT-SIZE: 20px; BACKGROUND: none transparent scroll repeat 0% 0%; FLOAT: left; PADDING-BOTTOM: 5px; COLOR: #ffffff; BORDER-TOP-STYLE: none; PADDING-TOP: 5px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; TEXT-ALIGN: center; BORDER-BOTTOM-STYLE: none; line-: 1.2em}

A.toptsel:link { PADDING-RIGHT: 0px; DISPLAY: block; PADDING-LEFT: 10px; FONT-WEIGHT: bold; FONT-SIZE: 20px; BACKGROUND: none transparent scroll repeat 0% 0%; FLOAT: left; PADDING-BOTTOM: 5px; COLOR: #ffffff; BORDER-TOP-STYLE: none; PADDING-TOP: 5px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; TEXT-ALIGN: center; BORDER-BOTTOM-STYLE: none; line-: 1.2em}

.header .globalnav UL.gnopt A {COLOR: #77bbc8}
.header .globalnav A.select {COLOR: #77bbc8}

LI.gnopt A {COLOR: #77bbc8}
LI.gnopt A:visited {COLOR: #77bbc8}
LI.gnopt A:link {COLOR: #77bbc8}
LI.gnoptsel {BORDER-LEFT-COLOR: #ccc; BORDER-BOTTOM-COLOR: #ccc; BORDER-TOP-COLOR: #ccc; BORDER-RIGHT-COLOR: #ccc}
LI.rss A:link;A:visited {COLOR: #cccccc}

A {COLOR: #77bbc8}
A:link {COLOR: #77bbc8}
A:visited {COLOR: #77bbc8}
A.vopt {COLOR: #fa0fa0}
A.vopt:visited {COLOR: #77bbc8}
A.vopt:link {COLOR: #77bbc8}

SPAN.signoutid A {COLOR: #77bbc8}
SPAN.signoutid A:link {COLOR: #77bbc8 }
SPAN.signoutid A:visited {COLOR: #77bbc8}


DIV#ownedfooterc {BORDER-TOP: #14181a 8px solid; MARGIN-TOP: 20px; BORDER-BOTTOM-WIDTH: 5px}

DIV#ownedfooter A {COLOR: #77bbc8}

DIV#ownedfooter { BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; MARGIN: 0px; COLOR: #999999; BACKGROUND-COLOR: #000000; BORDER-RIGHT-WIDTH: 0px; padding: 10px;}

.itemboxsub { PADDING-LEFT: 5px; FONT-WEIGHT: bold; FONT-SIZE: 18px; COLOR: #62c841; BORDER-TOP-STYLE: none; FONT-FAMILY: serif; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BACKGROUND-COLOR: #14181a; BORDER-BOTTOM-STYLE: none; padding-top: 1px; padding-bottom: 1px; padding-right: 5px;}

.replybox table{ background : none; background-color: #222222; border : none; padding-bottom: 3px;}

.replybox img{ max-width: 600px;}

.dummy { padding-top: 3px; background-color: #222222;
/*border-bottom: 1px solid #999999;*/
}

.replybox { background: #222222; color:#999999; border : none;}

.itemsubsub { FONT-WEIGHT: normal; FONT-SIZE: 10px; COLOR: #62c841; LINE-HEIGHT: 10px; TEXT-ALIGN: right}

.itemstamp {FONT-WEIGHT: normal; FONT-SIZE: 10px; FLOAT: right; MARGIN: -5px 0px 5px; COLOR: #e7d3d2;}

.itembox { PADDING-RIGHT: 10px; PADDING-LEFT: 10px; PADDING-BOTTOM: 10px; MARGIN: 0px; OVERFLOW: visible; BORDER-TOP-STYLE: none; LINE-HEIGHT: 1.2; PADDING-TOP: 10px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; HEIGHT: 1%; BACKGROUND-COLOR: #000000; BORDER-BOTTOM-STYLE: none
}

DIV.rail { WIDTH: 160px; }
TD.rail {WIDTH: 160px; }
DIV.rail {BORDER-TOP: #e7d3d2 1px solid; BORDER-BOTTOM: #e7d3d2 1px solid;}

.infobox {BACKGROUND-COLOR: #222}
UL.sidelist LI {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; PADDING-TOP: 0px; LIST-STYLE-TYPE: none}
UL.sidelist {PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px}

.railstart {BACKGROUND: none transparent scroll repeat 0% 0%; MARGIN: 0px; WIDTH: 160px; HEIGHT: 20px}

.railbody IFRAME {MARGIN-LEFT: 10px}
.railbody {PADDING-RIGHT: 15px; PADDING-LEFT: 15px; BACKGROUND: none transparent scroll repeat 0% 0%; PADDING-BOTTOM: 0px; MARGIN: 0px; WIDTH: 130px; BORDER-TOP-STYLE: none; PADDING-TOP: 15px; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none;BACKGROUND-COLOR: #000000;}

.railend {BACKGROUND: none transparent scroll repeat 0% 0%; WIDTH: 160px; HEIGHT: 10px}

.railsep {BACKGROUND: none transparent scroll repeat 0% 0%}
DIV#page_start {MARGIN: 0px 10px}
TD#maincontent {PADDING-RIGHT: 15px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 15px}
TABLE.indextitle {DISPLAY: none}

.itemboxalbum {BORDER-TOP-WIDTH: 0px; PADDING-RIGHT: 10px; PADDING-LEFT: 10px; BORDER-LEFT-WIDTH: 0px; BACKGROUND: #222; BORDER-BOTTOM-WIDTH: 0px; PADDING-BOTTOM: 10px; PADDING-TOP: 10px; TEXT-ALIGN: center; BORDER-RIGHT-WIDTH: 0px}

.album {MARGIN: 10px 10px 10px 10px}
.album IMG {BORDER-RIGHT: #383838 3px solid;BORDER-TOP: #383838 3px solid;BORDER-LEFT: #383838 3px solid;BORDER-BOTTOM: #383838 3px solid;}

.icon { DISPLAY: inline}

#miniprofile_div{height:20px;BACKGROUND: #336699;}

.viewmore{PADDING-BOTTOM: 5px; MARGIN: 0px; PADDING-TOP: 0px; PADDING-RIGHT: 5px}

.contactbox{BACKGROUND: #FFFFFF;border : 2px solid #383838;}
#viewing_history_holder{BACKGROUND: #FFFFFF;border : 2px solid #383838;}




โดย http://samarn.multiply.com
admin
Site Admin
 
โพสต์: 196
ลงทะเบียนเมื่อ: เสาร์ มี.ค. 20, 2010 11:32 pm
ข้างบน
ตอบกระทู้

ย้อนกลับไปยัง Multiply

 


  • กระทู้ที่คล้ายกับ
    ตอบกลับ
    แสดง
    โพสต์ล่าสุด

ผู้ใช้งานขณะนี้

กำลังดูบอร์ดนี้: ไม่มีสมาชิก และ บุคคลทั่วไป 0 ท่าน

Powered by phpBB © 2000, 2002, 2005, 2007 phpBB Group