名片樣式－休息時刻－自然時記

↑名片樣式的版型。

/*************************************
樣式名稱：休息時刻
素材來源：★Dream of echi★　ECHI繪畫
樣式作者：悠然薰風
部落格網址：http://blog.pixnet.net/floragreen
適用版型：Pixnet
CSS參考PIXNET的預設樣式，
可自行修改，請尊重，勿隨意轉載散播。
**************************************/
body{
	background:url(http://p8.p.pixnet.net/albums/userpics/8/0/437880/1179592355.jpg) center repeat-y;
	margin:0px;
	padding:0px;
	font-family:Verdana;
}

#container{
	background:url(http://p8.p.pixnet.net/albums/userpics/8/0/437880/normal_1179592355.jpg) center repeat-y;
	width:900px;
	margin:0 auto;
	padding:0;
	border-left : 1px solid #E4E4CB; /*左框線*/ 
    border-right : 1px solid #E4E4CB; /*右框線*/ 
}

#pageHeader{
	background:url(http://p8.p.pixnet.net/albums/userpics/8/0/437880/1179591097.jpg) top no-repeat;
	position:relative;
	height:400px;
}

.homeLink {
	padding:21px 0px 0px 42px;
}

.homeLink a{
	display:block;
	height:40px;
	width:180px;
}

.navBarLink {
	text-align:right;
	position:absolute;
	top:5px;
	right:20px;
}

.navBarLink, .navBarLink a{
	color:#BBBBBB;
	font-size:12px;
}

#userName {
	width:228px;
	text-align:center;
	position:absolute;
	left:130px;
	top:119px;
}

#userName a{
	color:#000;
	font-size:12px;
	text-decoration:none;
	vertical-align:middle;
}

#userName a:hover{
	color:white;
	font-size:12px;
	text-decoration:underline;
}

#userLinks {
	position:absolute;
	top:80px;
	right:80px;
	width:245px;
}

#userLinks div{
	display:inline;
}

#userLinks div a{
	display:block;
	float:left;
	height:17px;
	padding-top:5px;
	width:48px;
	font-size:12px;
	color:#BBBBBB;
	text-align:center;
	text-decoration:none;
	margin:0px 5px;
}

#userLinks div a:hover{
	background:url(http://p8.p.pixnet.net/albums/userpics/8/0/437880/1179686962.jpg);
}

#pageBody{
	background:url(http://p8.p.pixnet.net/albums/userpics/8/0/437880/1179591849.jpg) repeat-y;
}

#bodyContent{
	clear:both;
	background:url(http://p8.p.pixnet.net/albums/userpics/8/0/437880/1179592355.jpg) no-repeat;
	position:relative;
	width:900px;
}

#bodyFooter {
	clear:both;
}

#userBox{
	width:250px;
	text-align:center;
	float:left;
	padding-left:120px;
}

#userBox #userPhoto {
	margin:10px auto 0;
	width:200px;
	height:200px;
	padding:6px 11px 10px 6px;
	background: url(http://p8.p.pixnet.net/albums/userpics/8/0/437880/1179592581.jpg);
}

#userBox img{
	vertical-align:middle;
}

#userBox #valign {
	width:0px;
	height:200px;
}

#userBox #userAdd {
	margin:20px auto 0;
	width:156px;
}

#userBox #userAdd span{
	display:none;
}

#userBox #userAdd a{
	display:block;
	height:43px;
	width:156px;
	background:url(http://p8.p.pixnet.net/albums/userpics/8/0/437880/1179594455.jpg);
}

#dataBox {
}

#dataTabs {
	position:absolute;
	top:-39px;
	right:100px;
}

#dataTabs span {
	display:block;
	padding-top:8px;
	margin-left:6px;
	height:20px;
	width:77px;
	background:url(http://p8.p.pixnet.net/albums/userpics/8/0/437880/1179595467.jpg) no-repeat;
	float:left;
	text-align:center;
}

#dataTabs span a{
	font-size:12px;
	text-decoration:none;
	color:#000080;
}

#dataTabs span.tabActive {
	background:url(http://p8.p.pixnet.net/albums/userpics/8/0/437880/1179595468.jpg) no-repeat;
	color:black;
}

#dataTabs span.tabActive a{
	color:black;
}

#dataContent{
	width:400px;
	margin-left:395px;
}

#contentDesc table{
	font-size:13px;
	width:400px;
}

#contentDesc .formTitle{
	color:#669900;
	height:30px;
	font-weight:bold;
	background:url(http://p8.p.pixnet.net/albums/userpics/8/0/437880/1179595916.gif) bottom no-repeat;
}

#contentDesc .formTitle span{
	display:block;
	padding-left:15px;
	background:url(http://p8.p.pixnet.net/albums/userpics/8/0/437880/1179678302.gif) left center no-repeat;
}

#contentDesc .formData {
	line-height:25px;
}

#contentDesc .formData span{
	display:block;
	background:#FAFAF;
	margin-top:5px;
	padding:5px;
}

#contentAbout table{
	font-size:13px;
	width:400px;
	
}

#contentAbout tr{
	background:url(http://p8.p.pixnet.net/albums/userpics/8/0/437880/1179595916.gif) bottom no-repeat;
}

#contentAbout th{
	height:65px;
	width:75px;
}

#contentAbout th span{
	width:50px;
	padding-left:25px;
	background:url(http://p8.p.pixnet.net/albums/userpics/8/0/437880/1179678302.gif) 10px center no-repeat;
	text-align:left;
	color:#669900;
}

#contentFriends {
	width:400px;
}

#contentFriends ul{
	margin:0;
	padding:0;
	list-style-type:none;
}

#contentFriends li.friendBox{
	float:left;
	width:116px;
	height:157px;
	margin:10px 7px;
	background:url(http://p8.p.pixnet.net/albums/userpics/8/0/437880/1179686108.jpg) no-repeat;
}

#contentFriends li .friendIcon{
	padding-top:14px;
	height:60px;
	text-align:center;
}

#contentFriends li .friendLink{
	padding-top:32px;
	text-align:center;
}

#contentFriends li .friendLink a{
	color:#8C8C8C;
	font-size:12px;
}

#pageFooter {
	background: url(http://p8.p.pixnet.net/albums/userpics/8/0/437880/1179592355.jpg) no-repeat;
	clear:both;
	width:900px;
	height:100px;
	text-align:center;
	font-size:12px;
	border-top: dotted 1px #E4E4CB;
    padding-top: 10px 0px;
    padding-bottom: 0px;
    margin-top: 30px;
}

#footernav {
	padding-top:60px;
	float:right;
	padding-right:100px;
}

#footernav a{
	color:#777;
}

#copyright {
	padding-top:60px;
	padding-left:100px;
	float:left;
	color:#888888;
}

.spacer {
	clear:both;
}

div.menu {
            position: absolute;
            visibility:hidden;
            width: 90px;
            z-index:500;
            font-size:12px;
            margin-top:6px;
            margin-left:12px;
            border: 1px solid #E2E2E2;
            background-color: #fff;
        }
        div.menu ul { margin:0; padding:0 }
        div.menu ul li { list-style-type:none; text-align:center; display: block; border: 3px solid #F4F4F4;}
        div.menu a { text-decoration:none; white-space:nowrap; display: block; padding: 2px; line-height:20px;}
        div.menu a:link { color:#444 }
        div.menu a:visited { color:#444 }
        div.menu a:hover { color:#444; background-color: #E3E3E3; }

.pageSelector		{ text-align:center; margin-top:10px;padding:4px;}
	.pageSelector ul 	{ padding:0px; margin:0px; list-style-type:none;}
	.pageSelector ul li{ display:inline;}
	.pageSelector a, .pageSelector a:active, .pageSelector a:visited, .pageNow {
		color:#8C8C8C;
		background:#fff;
		border: solid 1px #E2E2E2;
		padding:3px 5px;
		text-decoration: none;
		vertical-align:middle;
		font-size: 12px;
		}
	.pageSelector a:hover, .pageNow {
			text-decoration:none;
			background:#F4F4F4;
		}
		
a{
font-size : 9pt; /*文字大小*/
text-decoration:none;/*刪除連結線*/}
a:link/*超連結*/ 
{color : #000 ; /*文字色彩*/}                                       
a:visited/*瀏覽過的超連結*/
{color : #000 ; /*文字色彩*/}                                      
a:active/*按下連結*/ 
{color : #000 ; /*文字色彩*/}                                 
a:hover/*滑鼠移至連結*/ 
{url("http://floragreen.myweb.hinet.net/018.ani"),text; /*游標圖案*/
color : #ccc ; /*文字色彩*/
border-bottom : 1px dotted #E3E3E3 ; /*下框線*/}

HTML
{
 SCROLLBAR-FACE-COLOR: #F4F7EE;
 SCROLLBAR-HIGHLIGHT-COLOR: #E4E4CB;
 SCROLLBAR-SHADOW-COLOR: #E4E4CB;
 SCROLLBAR-3DLIGHT-COLOR: #fcfcfc;
 SCROLLBAR-ARROW-COLOR: #E4E4CB;
 SCROLLBAR-TRACK-COLOR: #fcfcfc;
 SCROLLBAR-DARKSHADOW-COLOR: #fcfcfc;
 SCROLLBAR-BASE-COLOR: #fcfcd8
}
BODY {CURSOR: url("http://floragreen.myweb.hinet.net/036.ani"); }
A:hover {CURSOR: url("http://floragreen.myweb.hinet.net/018.ani"); }

↑名片樣式的CSS，如喜愛者請自行複製，記得告知我一聲。

　　前天電腦修理好之後，我又連夜趕工，把剩下的CSS完成，終於大功告成了，之後又看一看哪裡有問題，順便把CSS修正一下，一整夜都不太想睡，只到天快亮時，才漸漸地有睡意。我放著正經事不做，老是東摸摸，西摸摸，真是太不應該了。

寫於2007/5/22(二) 丑時

floragreen

自然時記

floragreen 發表在痞客邦留言(1) 人氣()

E-mail轉寄

自然時記

︿^︿磨菇草原。金魚池塘。青澀山谷︿^︿

公佈欄

名片樣式－休息時刻

留言列表

月曆

近期文章

文章分類

寫作創作 (3)

私人天地 (5)

我的連結

【個人網頁】

文章彙整

最新迴響

部落格文章搜尋

誰來我家

新聞交換(RSS)

參觀人氣

RSS訂閱

«	七月 2024					»
日	一	二	三	四	五	六
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28	29	30	31

«	七月 2024					»
日	一	二	三	四	五	六
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28	29	30	31

«	七月 2024					»
日	一	二	三	四	五	六
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28	29	30	31