[PIXNET相簿樣式分享]リボン模版-嫩綠色

希望大家會喜歡

喜歡的拿走後要留言

算是給版主最棒的鼓勵唷!

@版主的貼心小叮嚀:
1.由於版主沒有提供預覽圖示  所以請自行將喜歡的語法貼回自己的樣式設計精靈點選預覽樣式
2.若遇到版主的語法有問題   請盡速通知版主修正或到版主的部落格中在重新複製語法
3.版主會將私下分享的自製語法檢查N遍   若有錯誤會修正並貼回原來發表樣式的文章中



免責聲明:
1.本CSS語法痞客邦模版才適用喔
2.本人非抄襲他人  若有雷同純屬巧合
3.若有侵權行為請告知   本人立刻下架
4.本語法是本人私下分享非為公開貢獻的樣式
5.若有不滿意之處可以盡情且任意修改
6.拿走樣式語法記得留言唷!若無法按右鍵複製請立即留下你的足跡通知我
7.請尊重原著  不要擅自發表或分享   發表或分享時請善用引用

8.以上規則希望各位能遵守  不便之處敬請見諒


版主同時推出同款各色的CSS語法
請點以下連結
亮黑色模版
粉紅色模版


語法如下


/*************************************
作者:陽光甜姐兒
套用請留言,修改請留言給我
別當小偷喔,卸卸你的尊重呀
**************************************/

html{
 SCROLLBAR-FACE-COLOR: #b4fc48;
 SCROLLBAR-HIGHLIGHT-COLOR: #b4fc48;
 SCROLLBAR-SHADOW-COLOR: #b4fc48;
 SCROLLBAR-3DLIGHT-COLOR: #006c00;
 SCROLLBAR-ARROW-COLOR: #006c00;
 SCROLLBAR-TRACK-COLOR: #d8fc6c;
 SCROLLBAR-DARKSHADOW-COLOR: #006c00;
 SCROLLBAR-BASE-COLOR: #006c00
}


body {
 margin:0;
 padding:0;
 font-family: 'trebuchet ms', verdana, sans-serif;
 font-size: 12px;
 color: #006c00;
 BACKGROUND:url(http://nyokiope.com/nyokiaya/ayasozai/kabe/pribon/gribon3/k_0324.gif);}

a, a:link, a:active, a:visited { color: #006c00; text-decoration: none; }
a:hover { color: #006c00; text-decoration: underline;}


#container { position:relative;width:750px;border:2px double  #006c00; background:url() ; margin:0 auto; }

/***** Page Header ******/

#pageHeader {}
/**********************************************************************
**
** pageHeader 內容解析
**
** navbar:
**
**  homeLink  (回到 Pixnet首頁之透明 GIF 連結,可自由運用)
**  navbarLink  (Pixnet 基本連結列,包括登入、登出以及管理介面)
**
** headerBody
**
**  albumPanel  (相簿標題與描述):
**   albumName (使用者自訂相簿名稱)
**   albumTopic (使用者自訂相簿主題描述)
**
**  userPanel  (使用者之各項連結-預設為隱藏,可自由顯示):
**   userAlbum (連往使用者之相簿)
**   userBlog (連往使用者之部落格)
**   userGbook (連往使用者之留言板)
**   userProfile (連往使用者之個人名片)
**   userProfile (連往使用者之個人名片)
**
**  userFunctions (各項特殊功能按鈕-陸續增加中):
**   rssLink  (整體相簿、單本相簿之RSS訂閱連結)
**
**  userFriends  (好友名單-除位置外其他樣式無法自由修改)
**
***********************************************************************/

#navbar { padding:5px 10px; height:150px; margin:0 auto; text-align:right;}

.homeLink { display: none; }
.navBarLink {}
.navBarLink a, .navBarLink a:visited, .navBarLink a:active { color:#006c00; }
.navBarLink a:hover {}
   
#headerBody {}
  
 #albumPanel { position:absolute; top:30px; left:10px;}
  #albumName { font-size:20px; }
  #albumName a{ color:#006c00; }
  #albumTopic { color:#006c00; }
  .displaythumbs #albumTopic, .displayimage #albumTopic {}
  
 #userPanel { position:absolute; z-index:10; top:100px; left:10px;}
  .userAlbum a {}
  .userBlog a  {}
  .userGbook a {}
  .userProfile a {}
  .link-separator {}
   
#userFriends {}
#userFriends ul {}
#userFriends a span{ padding:3px 6px; border:1px solid #006c00; background:color:#d8fc6c;filter:alpha(opacity=80); -moz-opacity:.80; opacity:.80; }  

#userFriends a:hover { text-decoration: none;}
#userFriends a:hover span{ filter:alpha(opacity=100); -moz-opacity:1.0; opacity:1.0; }

/***** Page Body ******/

#pageBody {}   

/**********************************************************************
**
** pagebody 內容解析
**
** contentHeader  (位置、頁數、換頁、選單、自定區塊等)
** contentBody   (頁面主要內容)
** contentFooter  (頁數資訊與換頁連結等)
**
***********************************************************************/

#contentHeader {} 
   
/**********************************************************************
**
** contentHeader 內容解析
**
** breadCrumb   (目前所在位置)
**  crumbCat  (所在分類)
**  crumbAlb  (所在相簿)
**
** albumCount   (相簿/圖片數量及頁數)
**
** navButtons   (相簿瀏覽功能及按鈕)
**
**  pageSelector (換頁連結)
**   pageParent (回上一層)
**   pagePrev (向前一頁)
**   pageNow  (目前所在頁數)
**   pageNumber (頁數)
**   pageBreak (頁數段落)
**   PageNext (向後一頁)
**
**  funcLinks  (瀏覽功能選單)
**   funcBrowse (相簿/圖片瀏覽功能選單)
**   funcInfo (相簿/圖片資訊選單)
**
** albumAbout   (相簿介紹區塊)
**  albumTitle  (相簿標題)
**  albumDesc  (相簿描述)
**
** userDiv    (相簿自定區塊)
**
***********************************************************************/

#breadCrumb {position:absolute;margin-top:-40px;width:70px;font-size:15px;text-align:center;}
#breadCrumb a, #breadCrumb a:active, #breadCrumb a:visited {}
#breadCrumb a:hover{}
 #crumbCat  {}
 #crumbAlb  {}

.albumCount { margin:0 auto;width:730px; height:30px;BACKGROUND:color:#d8fc6c;border: 1px solid #006c00; }
.albumCount span { color:#006c00; display:block;padding-top:5px;padding-left:10px;}

#navButtons {}


 .pageSelector  { text-align:center; margin-top:24px;}
 .pageSelector ul  { margin:0; padding:0; list-style-type:none;}
 .pageSelector ul li{ display:inline; padding:0 2px;}
 .pageSelector a, .pageSelector a:active, .pageSelector a:visited { padding:2px 5px; color:#006c00; border:1px solid #006c00; }
 .pageSelector a:hover {}
  .pageParent  {}
  .pagePrev  {}
  .pageNow  {}
  .pageNumber  {}
  .pageBreak  {}
  .pageNext  {}

 #funcLinks   { margin-top:-18px; margin-right:25px;text-align:right;}
 #funcLinks ul  { margin:0; padding:0; list-style-type:none; }
 #funcLinks ul li { display:inline; }
 #funcLinks a span{ padding:2px; border:1px solid #006c00; color:#006c00;}
 #funcLinks a:hover { color:white; text-decoration: none; }
 #funcLinks a:hover span{}
  .funcBrowse  {}
  .funcInfo  {}
  
#albumAbout {}
 .albumTitle  {}
 .albumDesc  {}

#userDiv {position:relative;margin:0px auto;margin-top:30px;width:720px;font-size:10px;text-align:center}

/***** Content Body  ******/

#contentBody { margin-top:20px; }

/**********************************************************************
**
** 相簿列表之 pageBody 內容解析
**
** albList ul     (相簿列表)
**  li.catBox    (相簿分類之框架)
**  li.albBox    (單本相簿之框架)
**   albThumb   (相簿封面圖外框)
**    img.thumb  (縮圖)
**    img.thumgSpacer (使縮圖垂直置中之透明GIF)
**   albData    (相簿資訊外框)
**    albTitleDiv  (相簿標題及額外資訊按鈕)
**     albInfo  (相簿額外資訊按鈕)
**     albPrivate (私人相簿符號)
**     albTitle (相簿標題)
**    albDesc  (相簿標題及額外資訊按鈕)
**
***********************************************************************/


.albList { margin:10px;width:750px;}


.albList ul { margin:0; padding:0; list-style-type:none;}
 .albBox { float:left;width:350px; height:150px;margin-bottom:20px;BACKGROUND: #d8fc6c;border: 1px solid #006c00; }
 .albBoxOdd { margin-right:20px; }
  .albThumb{ float:left;height:150px; width:120px; text-align:center;BACKGROUND: #d8fc6c; border-right: 1px solid #006c00;}
  .albBoxOdd .albThumb{    }
   .albThumb span{}
   .catBox .albThumb span{}
    .albThumb a img.thumb{ border:2px double #006c00;vertical-align:middle; }
    .albThumb a:hover img.thumb{ }
    .albThumb img.thumbSpacer{ height:150px; width:0px; vertical-align:middle; }
  .albData { float:right; overflow:hidden; overflow-y:auto;width:220px;height:150px;}
  .albBoxOdd .albData{ }
   .albTitleDiv { padding-top:10px;color:#006c00;border-bottom: 1px solid #006c00;}
    .albNum {}
    .albInfo { }
    .albInfo a img{}
    .albInfo a:hover img{}
    .albPrivate {}
    .albTitle {}
   .albDesc { padding-left: 15px;padding-top:10px; line-height:20px; }
  
#contentBody .spacerDiv{ clear:both; height:0px; }
  
/**********************************************************************
**
** 相簿縮圖頁面之 pageBody 內容解析
**
** thumbList ul    (縮圖清單)
**  li.thumbbox    (縮圖及標題之框架)
**   thumbImg   (縮圖框)
**    img.thumb  (縮圖)
**    img.thumgSpacer (使縮圖垂直置中之透明GIF)
**   thumbTitle   (圖片標題)
**
***********************************************************************/

.thumbList ul {
 display:block;
 list-style-type: none;
 margin:0px;
 padding:0px; }
 .thumbBox {
  float:left;margin-left:6px;}

  .thumbImg {
   BACKGROUND: #d8fc6c;
                                              border:3px double #006c00;
                                                 center top no-repeat;
   height:120px;
   width:120px;
   margin:6px;}
  .thumbImg span{
   display:block;
   padding-top:15px;
   padding-left:15px;
   text-align:center;
   width:90px;
   height:90px;}
   .thumbImg a img.thumb{
    border:0px;
    vertical-align:middle; }
   .thumbImg img.thumbSpacer{
    border:0px;
    width:0px;
    height:90px;
    vertical-align:middle; }
  .thumbTitle {
   width:130px;
   line-height:1.25em;
   height:3.75em;
   margin:10px 5px;
   text-align: center;
   color:#990033;
   overflow:hidden; }  
/**********************************************************************
**
** 圖片顯示頁面之 pageBody 內容解析
**
** imageBox    (主要內容框架)
**  imageTitle   (圖片標題)
**  imageFrame   (圖片外框)
**  imageCaption  (圖片標題)
**   captionContent (圖片標題)
** thumbStrip    (圖片標題)
**  thumbFrame   (圖片標題)
**  thumbAd    (圖片標題)
**
***********************************************************************/


#imageBox {text-align:center;margin:12px 0; }
 #imageTitle {margin:10px;}
 #imageFrame img{border:8px solid #006c00}

#imageCaption{margin:10px 8px;}

#thumbStrip  {display:block; width:720px; height:120px;margin:0 auto;}
#thumbStrip ul { margin:0; padding:0; list-style-type:none; }
#thumbStrip ul li{ float:left;height:120px; width:120px; text-align:center;BACKGROUND: url(http://nyokiope.com/nyokiaya/ayasozai/kabe/pribon/gribon3/k_0324.gif); border: 3px double #006c00;  margin:3px 7px;  }
 .thumbFrame { width:120px; height:120px; }
 .thumbFrame span {display:block;width:120px; padding-top:15px; text-align:center;}
 .thumbFrame img { border:0;vertical-align:middle; }
 .thumbAd {width:120px; height:120px; text-align:center; }
 .thumbAd span{display:block; padding-top:10px;}
 .thumbAd span.adFlag{display:none;}
 .thumbAd img{}
 #thumbStrip .thumbSpacer {width:0;height:90px;vertical-align:middle;}
 
.commPost {text-align:center;width:120px;margin:10px auto;background:color:#d8fc6c;  }
.commPost a {display:block;height:50px;width:120px;text-align:center;}
.commPost a span{ display:block;padding-top:20px;text-align:center; }
.commPost a:hover span{}
.commBox { position:relative;margin:15px 0;height:20px;width:720px;}
 .commAvatar {position:relative;top:0px;}
 .commAvatar p{margin:0; padding:0;}
 .commAvatar img{}
 .commBody {margin-bottom:25px;}
 .commBodywrap {}
  .commLinks {display:block;width:720px;border:1px solid #006c00;  BACKGROUND: url(http://nyokiope.com/nyokiaya/ayasozai/kabe/pribon/gribon3/k_0324.gif)}
   .commUsername a, .commUsername a:visited {display:block; padding:10px; color:white;}
   .commDate{position:absolute; top:10px;right:50px;}
   .commContent {padding-left:45px;padding-top:15px;}
   .commDelete{position:absolute; top:15px;right:10px;}
 .commBox .spacerDiv{clear:both; height:0px;}


#contentFooter {}
#contentFooter .albumCount{ }
#contentFooter .pageSelector{  }


#pageFooter {  text-align:center; padding-top:20px;}
  
/**********************************************************************
**
** pageFooter 內容解析
**
** footernav (連結列)
** copyright (版權列)
**
***********************************************************************/


#footernav {  }
#footernav a, #footernav a:active, #footernav a:visited { color:#006c00}
#footernav a:hover{}
#copyright {}

    
.privAlbMsg,.passAlbMsg,.Msgbox { width:350px; height:180px; position:relative; background:#d8fc6c; margin:0 auto;text-align:center;}
.privAlbMsg span,.passAlbMsg span,.Msgbox span {display:block; padding-top:55px;font-size:25px;}
.passAlbMsg span input{}

div.menu { position: absolute; visibility: hidden; width: 130px; left:0; top:0; z-index:500; font-size:12px;
 border: 1px solid #006c00; border-bottom: 0px solid #006c00; background-color: #d8fc6c;}
div.menu ul { margin:0; padding:0 }
div.menu ul li { list-style-type:none; display: block; border-bottom: 1px solid #006c00;}
div.menu a { background:#d8fc6c;text-decoration:none; white-space:nowrap; display: block; padding: 4px; line-height:20px;}
div.menu a:hover { color:#FF9900; background-color:#d8fc6c; }

div#tipDiv {
 position:absolute;
 visibility:hidden;
 left:-30px; top:0;
 z-index:10000;
 background-color:#eee;
 border:1px solid #333;
 width:225px;
 padding:6px;
 font-size:11px;
 line-height:1.3;}
div.ttHead {
 margin-bottom:5px;
 font-weight:bold;
 color:#333;}
div.ttBody {
 color:#777;}
div.fmenu {
        position:absolute;
  visibility:visibility;
        left:-100px;
        top: -100px;
        z-index: 500;
        background:#d8fc6c;
        border-top:1px solid #CBCBCB;
        border-left:1px solid #CBCBCB;
        border-right:1px solid #9D9D9D;
        border-bottom:1px solid #9D9D9D;
        overflow-y:auto;
        overflow-x:hidden;
        width:175px;
        max-height:320px;
        height:ex<x>pression( this.scrollHeight > 320? "320px" : "auto" );
     font-size:12px; }

div.fmenu ul {
        margin:0;
        padding:0;}
div.fmenu ul li {
  position:relative;
        list-style-type:none;
        display:block;}
div.fmenu ul li.friendCat {
        display:block;
        font-size:12px;
        color:white;
        background:#d8fc6c;
        font-family:Arial;
        font-weight:bold;
        text-decoration:none;
        padding:2px;}
div.fmenu ul li.friendLink a{
        display:block;
        width:100%;
        padding:2px 4px;}
div.fmenu ul li.friendLink a:hover{
        background: #000; }
div.fmenu ul li.friendLink img {
        padding:2px;
        vertical-align:top;
        border:0px;}
div.fmenu ul li.friendLink span.friendAvatar {
  display:block;
        width:34px;
  height:34px;
        background:white;
  text-align:center;
        border:1px solid #CBCBCB;}
div.fmenu ul li.friendLink span.friendID {
  margin-top:-33px;
  margin-left:43px;
        display:block;
        text-decoration:none;}
div.fmenu ul li.friendLink span.friendDesc {
  margin-left:43px;
  margin-bottom:5px;
        display:block;
        font-size:10px;
        color:#FCC99;
        font-family:Arial;
        text-decoration:none;}

arrow
arrow
    全站熱搜

    張紫彤 發表在 痞客邦 留言(4) 人氣()