加载中…
新浪博客Q－ZONE样式代码 CSS原理 cs首发
(2006-10-31 03:58:06)| 分类： *原创文章* -多多支持- |
代码：
GN原创
GN原创
<IMG style="DISPLAY: none"
src=""> <IMG style="Z-INDEX: 100; LEFT: 248px; POSITION:
absolute; TOP: 10px"
src="http://s14.sinaimg.cn/orignal/4acd95695ca46ba3375bd"> <EMBED
id=myflash style="LEFT: 1013px; WIDTH: 160px; POSITION: absolute;
TOP: 320px; HEIGHT: 200px"
src=http://gainover.googlepages.com/qzoneblog.swf?id=1254987113
type=application/octet-stream wmode="transparent">
<STYLE>
#myflash{
z-index:250;
}
BODY{
overflow:hidden;
}
.bodyTop,.banner{
display:none;
}
.box_1{
position:absolute;
left:-220;
}
.bodyBg{
background:url()
}
.menu{
background:url('');
position:absolute;
top:0;
left:0;
}
.bodyBox{
width:1023;
height:570;
background:url(http://s9.sinaimg.cn/orignal/4acd95694fdf011b34f08) no-repeat;
text-align:center;
margin-left:0px;
margin-right:0px;
padding-left:0px;
padding-right:0px;
}
#box_2{
background:#fff;
z-index:2;
position:absolute;
width:748;
height:494;
overflow-y:scroll;
top:42;
left:54;
scrollbar-arrow-color: #f4ae21; /*三角箭头的颜色*/
scrollbar-face-color: #333; /*立体滚动条的颜色*/
scrollbar-3dlight-color: #666; /*立体滚动条亮边的颜色*/
scrollbar-highlight-color: #666; /*滚动条空白部分的颜色*/
scrollbar-shadow-color: #999; /*立体滚动条阴影的颜色*/
scrollbar-darkshadow-color: #666; /*滚动条强阴影颜色*/
scrollbar-track-color: #666; /*立体滚动条背景颜色*/
scrollbar-base-color:#f8f8f8; /*滚动条的基本颜色*/
}
.bodyBottom{
display:none;
}
</STYLE>
代码分析：
<STYLE>
#myflash{
z-index:250;
}
BODY{
overflow:hidden;
}
.bodyTop,.banner{
display:none;
}
.box_1{
position:absolute;
left:-220;
}
.bodyBg{
background:url()
}
.menu{
background:url('');
position:absolute;
top:0;
left:0;
}
.bodyBox{
width:1023;
height:570;
background:url(http://s9.sinaimg.cn/orignal/4acd95694fdf011b34f08) no-repeat;
text-align:center;
margin-left:0px;
margin-right:0px;
padding-left:0px;
padding-right:0px;
}
#box_2{
background:#fff;
z-index:2;
position:absolute;
width:748;
height:494;
overflow-y:scroll;
top:42;
left:54;
scrollbar-arrow-color: #f4ae21;
scrollbar-face-color: #333;
scrollbar-3dlight-color: #666;
scrollbar-highlight-color: #666;
scrollbar-shadow-color: #999;
scrollbar-darkshadow-color: #666;
scrollbar-track-color: #666;
scrollbar-base-color:#f8f8f8;
}
.bodyBottom{
display:none;
}
</STYLE>
代码分析：
CODE:
<IMG style="DISPLAY: none" src=""> <IMG style="Z-INDEX:
100; LEFT: 248px; POSITION: absolute; TOP: 10px" src="http://s14.sinaimg.cn/orignal/4acd95695ca46ba3375bd">（
这个框，你可以自己到Q－ZONE里找喜欢的然后存到SINA
BLOG里，直接调用地址）<EMBED id=myflash style="LEFT: 1013px;
WIDTH: 160px; POSITION: absolute; TOP: 320px; HEIGHT: 200px"
src=http://gainover.googlepages.com/qzoneblog.swf?id=1254987113
type=application/octet-stream
wmode="transparent">（进场FLASH，可以参考这篇文章：http://blog.sina.com.cn/u/49bf8d500100068y)
<STYLE>
#myflash{
z-index:250;
}
BODY{
overflow:hidden;
}
.bodyTop,.banner{
display:none;
}(顶部隐藏）
.box_1{
position:absolute;
left:-220;
}（左侧边栏定位）
.bodyBg{
background:url()
}（页面内背景透明）
.menu{
background:url('');
position:absolute;
top:0;
left:0;
}（MENU背景透明）
.bodyBox{
width:1023;
height:570;
background:url(“http://s9.sinaimg.cn/orignal/4acd95694fdf011b34f08”)（QQ-ZONE 大背景，你可以自己到Q－ZONE里找喜欢的然后存到SINA BLOG里，直接调用地址）no-repeat;
text-align:center;
margin-left:0px;
margin-right:0px;
padding-left:0px;
padding-right:0px;
}
#box_2（文章部分）{
background:#fff;
z-index:2;
position:absolute;
width:748;
height:494;
overflow-y:scroll;
top:42;
left:54;
scrollbar-arrow-color: #f4ae21; /*三角箭头的颜色*/
scrollbar-face-color: #333; /*立体滚动条的颜色*/
scrollbar-3dlight-color: #666; /*立体滚动条亮边的颜色*/
scrollbar-highlight-color: #666; /*滚动条空白部分的颜色*/
scrollbar-shadow-color: #999; /*立体滚动条阴影的颜色*/
scrollbar-darkshadow-color: #666; /*滚动条强阴影颜色*/
scrollbar-track-color: #666; /*立体滚动条背景颜色*/
scrollbar-base-color:#f8f8f8; /*滚动条的基本颜色*/
}
.bodyBottom{
display:none;
}（最下面的bodyBottom隐藏）
</STYLE>
这个框，你可以自己到Q－ZONE里找喜欢的然后存到SINA
BLOG里，直接调用地址）<EMBED id=myflash style="LEFT: 1013px;
WIDTH: 160px; POSITION: absolute; TOP: 320px; HEIGHT: 200px"
src=http://gainover.googlepages.com/qzoneblog.swf?id=1254987113
type=application/octet-stream
wmode="transparent">（进场FLASH，可以参考这篇文章：http://blog.sina.com.cn/u/49bf8d500100068y)<STYLE>
#myflash{
z-index:250;
}
BODY{
overflow:hidden;
}
.bodyTop,.banner{
display:none;
}(顶部隐藏）
.box_1{
position:absolute;
left:-220;
}（左侧边栏定位）
.bodyBg{
background:url()
}（页面内背景透明）
.menu{
background:url('');
position:absolute;
top:0;
left:0;
}（MENU背景透明）
.bodyBox{
width:1023;
height:570;
background:url(“http://s9.sinaimg.cn/orignal/4acd95694fdf011b34f08”)（QQ-ZONE 大背景，你可以自己到Q－ZONE里找喜欢的然后存到SINA BLOG里，直接调用地址
）no-repeat;text-align:center;
margin-left:0px;
margin-right:0px;
padding-left:0px;
padding-right:0px;
}
#box_2（文章部分）{
background:#fff;
z-index:2;
position:absolute;
width:748;
height:494;
overflow-y:scroll;
top:42;
left:54;
scrollbar-arrow-color: #f4ae21;
scrollbar-face-color: #333;
scrollbar-3dlight-color: #666;
scrollbar-highlight-color: #666;
scrollbar-shadow-color: #999;
scrollbar-darkshadow-color: #666;
scrollbar-track-color: #666;
scrollbar-base-color:#f8f8f8;
}
.bodyBottom{
display:none;
}（最下面的bodyBottom隐藏）
</STYLE>
代码转自：潮流风互动娱乐社区，分析是我自己分析的，大家就可以利用这代码来把你的SINA
变成Q－ZONE~，知道原理了大家就可以自己DIY了，大家来试试看哈~
喜欢
0
赠金笔