經過一夜的測試,再歸納一些plurk的css語法,
也順便介紹幾個簡單的css的語法,
1. color:red….改變字的顏色red,前面如果有a表示那是個連結
2. font-size:12px…..字的大小12
3. background:url(圖片網址)…..加入底圖
4. background-color:red…..背景顏色red
5. border:1px solid red…..加框,寬度是1px,顏色red
另外就是不能用display:none把某個東西隱藏,這個是被禁止的。
補充:目前用float也是禁止的,但未來是否會依照karma值調整呢?我也不確定
其他就看我底下的範例囉~
/*整個頁面設定,含背景圖更改*/
body, html { font-family: Verdana, Arial; background:url(http://farm4.static.flickr.com/3293/2701035262_fb241996cf_o.jpg) top left }
/*上方BAR*/
#top_login {background-color:#FFF; margin:0 ;padding:0;height:30px;line-height:25px;background:url(http://ipk.tw/plk/top_login.png) 0px -18px repeat-x ;}
#top_login a{color:#030;}
/*上方BAR的左半邊*/
#top_bar .content a{color: #030; font-weight: normal ;}
#top_bar .content a:hover{color:red; font-weight: normal ;}
#top_bar .content a#edit_link{color:#FFF; font-weight: bold ; background-color:#a0a;} /* edit的修改 */
/*時間軸的左下方更新通知欄*/
#updater {border:0; }
#updater #noti_np #noti_np_text{color:#00C; } /*左半邊*/
#updater #noti_np a{color:#C00;}
#updater #noti_re #noti_re_view #noti_re_text {color:#00C} /*右半邊*/
#updater #noti_re #noti_re_view a{color:#C00;}
/*時間軸*/
#timeline_holder {margin:0 ;padding:0 ; border:0 ; background: none; background-color:#FFF; }
#timeline_holder #timeline_cnt #time_show {}
#timeline_holder #timeline_cnt #display_options_holder {}
#timeline_holder #timeline_cnt .day_start {background-color:#FFF} /*換日線*/
#timeline_holder #timeline_bg .bottom_start , .bottom_end {color:#C00} /*時間條字的顏色*/
#timeline_holder #bottom_line {background-color:#FFF; border:0px ;} /*時間條背景色*/
#timeline_holder #dynamic_logo {}/*時間軸的右上方的動物logo圖*/
/*時間軸裡的每個人寫的plurk內容*/
.plurk_cnt {background-color:#add589 ; border-color:#030 ;}
a.name{color: #030;}
.text_holder {color: #555;}
/********下方的個人資料大區塊*********/
/*右上方觀看3個小區塊,所有plurk、我的plurk,私密plurks*/
#filter_tab a {background-color: } /*已選擇的*/
#filter_tab a.off_tab {border:0px} /*未選擇的*/
/*Plurk 顯示名稱 及 填寫plurk處*/
#main_poster .qual_holder{color:#004080; font-wight:bold ; font-size:20px;}
/*私密plurk、語系與選項 */
#more_options {border:0px solid #CCC;}
#more_options a#more_options_link {}
/*後面的文字*/
#more_options #plurk_to{color:#000;}
#more_options #more_options_holder{}
/****第一區塊~ 第四區塊 ****/
#plurk-dashboard{ background:none; border:1px dotted #090;} /*他是一張底圖,要去掉必須先 background:none;*/
/*第一區塊*/
/*個人全名*/
#dash-profile p#full_name{color:#369}
/*個人年紀、性別*/
#dash-profile #span_years , #m_or_f{font-size:12px;}
/*個人來自國家,這邊可以加上國旗*/
#dash-profile #location{padding-left:30px;background:url(http://farm4.static.flickr.com/3110/2697323733_f587dd7620_o.jpg) no-repeat; }
/*個人額外自填的自我介紹*/
#dash-additional-info {font-family: Verdana, Arial;}
#dash-additional-info #about_me{color:#00C;}
#dash-additional-info #about_me a{color:#F06;}
#dash-additional-info #about_me a:hover{color:#C00;}
/*第二區塊 stats*/
#dash-stats{}
#dash-stats h2{color:#FFF; background-color:#369;padding:3px;} /*區塊名稱*/
#dash-stats #karma {color:#C00;font-family: Arial} /*Karma數字*/
#dash-stats table tbody tr th{} /*下方左半邊*/
#dash-stats table tbody tr td{font-weight:bold;} /*下方右半邊*/
/*第三區塊 朋友 friends*/
#dash-friends {}
#dash-friends h2{color:#FFF; background-color:#369;padding:3px;font-weight:normal;} /*區塊名稱*/
#dash-friends #friend_holder{border:1px solid #aaa ;} /*朋友群大頭照*/
/*第四區塊 粉絲 fnas*/
#dash-fans{}
#dash-fans h2{color:#FFF; background-color:#369 ;padding:3px;font-weight:normal;} /*區塊名稱*/