【部落格素材教學法】紫蘿琳製【珠扣心懸】動畫框《粉色系列》＠☆★風吹向落葉。隨風飄落的楓葉。學習的園地-落葉之楓的新聞台★☆

2008-01-23 18:57:12 | 人氣16| 回應0 | 上一篇 | 下一篇

【部落格素材教學法】紫蘿琳製【珠扣心懸】動畫框《粉色系列》

推薦 0 收藏 0 轉貼0 訂閱站台

紫蘿琳製【珠扣心懸】動畫框《粉色系列》

框線示範圖↓

典雅、高貴又大方，粉粉嫩嫩的框線組合。

假如搭配黑色背景，我想這組會非常的嗆眼。

框線語法

/*Shared rounded corner for all modules 紫蘿琳製【珠扣心懸】動畫框《粉色系列》*/
.ycntmod {width:100%;position:relative;margin-bottom:5px;overflow:hidden;}
.ycntmod .rctop {zoom:1;background:url(http://kiss2008.t35.com/caroline985/pc007nth458Wum561b.gif) left top no-repeat;margin-right:5px;}
.ycntmod .rctop div {background:url(http://kiss2008.t35.com/caroline985/pc007nth458Wum562b.gif) right top no-repeat;height:42px;font-size:0;position:relative;right:-5px;}
.ycntmod .rcbtm {zoom:1;background:url(http://kiss2008.t35.com/caroline985/pc007nth458Wum563b.gif) left bottom no-repeat;margin-right:5px;}
.ycntmod .rcbtm div {background:url(http://kiss2008.t35.com/caroline985/pc007nth458Wum564b.gif) right bottom no-repeat;height:30px;font-size:0;position:relative;right:-5px;}
.ycntmod .rcl {padding-left:13px;background:url(http://kiss2008.t35.com/caroline985/pc007nth458Wum565b.gif) repeat-y;}
.ycntmod .rcr {zoom:1;padding-right:13px;background:url(http://kiss2008.t35.com/caroline985/pc007nth458Wum566b.gif) right repeat-y;}
.ycntmod .text {position:relative;word-break:break-all;}
.yc3pribd .ycntmod{overflow:visible;}
.yc3pribd .ycntmod .yblogcnt{overflow:hidden;}

語法解說

/*Shared rounded corner for all modules 琳自製動畫框圖*/
.ycntmod {width:100%;position:relative;margin-bottom:20px;overflow:hidden;}
.ycntmod .rctop {zoom:1;background:url(圖檔左上01) left top no-repeat;margin-right:10px;}
.ycntmod .rctop div {background:url(圖檔右上02) right top no-repeat;height:左右上第一.二框尺寸px;font-size:0;position:relative;right:-10px;}
.ycntmod .rcbtm {zoom:1;background:url(圖檔左下03) left bottom no-repeat;margin-right:10px;}
.ycntmod .rcbtm div {background:url(圖檔右下04) right bottom no-repeat;height:左右下三.四框尺寸px;font-size:0;position:relative;right:-10px;}
.ycntmod .rcl {padding-left:左五框尺寸px;background:url(圖檔左中05) repeat-y;}
.ycntmod .rcr {zoom:1;padding-right:右六框尺寸px;background:url(圖檔右中06) right repeat-y;}
.ycntmod .text {position:relative;word-break:break-all;}
.yc3pribd .ycntmod{overflow:visible;}
.yc3pribd .ycntmod .yblogcnt{overflow:hidden;}

使用在 (自訂樣式 )

進入 ( 管理部落格 ) 按 ( 面板設定 )

在按 ( 自訂樣式 )

貼上複製的 ( 語法 )

紅色部分→圖檔尺寸→圖檔網址

最後步驟，按下儲存就完成囉!

琳的 logo 連結