公布joyo模板样式表代码解释（部分）

2016-07-07 16:39 来源：www.chinab4c.com 作者：ecshop专家

/*===========================================
页面左边
===========================================*/
#left {
width: 180px;/*左边宽度*/
float: left;
padding-left: 20px;/*左边模块左边距*/
clear:both;
}
.title-01 {
height:29px;/*商品分类标题1高度*/
width:177px;/*商品分类宽度*/
background-image:url(images/title_01_bg.gif); /*商品分类背景图*/
}
.title-01-title {/*标题1商品分类文字控制*/
padding-left:15px;/*左边距*/
padding-top:8px;/*上边距*/
font-size:14px;/*字体大小*/
font-weight:bold;
color:#fff;/*字体颜色*/
}
#category-tree {/*商品分类列表*/
width:175px; /*宽度*/
border-left:1px #6CB8C5 solid;
border-right:1px #6CB8C5 solid;
border-bottom:1px #6cb8c5 solid;
background-color:#fff;
margin-bottom:8px;
}
#category-tree ul {
list-style-type:none;
}
#category-tree h3 { /*商品分类前的箭头图标*/
padding:6px 0 5px 27px;
margin-bottom:3px;
border-bottom:1px #E9ECE0 solid;
border-top:1px #E9ECE0 solid;
background-color:#F3F6EB;
background-image: url(images/icon.gif);
background-repeat: no-repeat;
background-position: 12px center;
}
#category-tree .yiji {/*商品分类列表右边的图标*/
float:right;
margin:-22px 10px 0 0;
width:20px;
height:20px;
background: url(images/zhedie.gif) no-repeat right top;
cursor:n-resize;
}
#category-tree .yiji2 {/*商品下级分类前面的短线*/
float:right;
margin:-22px 10px 0 0;
width:40px;
height:20px;
background: url(images/menu_minus.gif) no-repeat right top;
cursor:hand;
}
#category-tree .erji li {/*商品下级分类前面的短线*/
padding-left:30px;
padding-top:2px;
padding-bottom:3px;
border-bottom:1px #F3F6EB solid;
margin-bottom:3px;
background-image:url(images/erji.gif);
background-repeat: no-repeat;
background-position: 15px 4px;
}
.title-02 { /*标题2背景*/
width:98%;
margin-bottom:8px;
padding-bottom:5px;
border:1px #6CB8C5 solid;
background-image:url(images/title_02_bg.gif);
background-repeat: repeat-x;
background-position: top;
clear:both;
}
.title-02 .title {/*标题2文字，标题2包括右边的文章列表、浏览记录等*/
padding:8px 2px 0 15px;
font-size:14px;
margin-bottom:10px;
font-weight:bold;
color:#CD6702;
}
.title-02 .more {
text-align:right;
padding-right:10px;
}
.title-02 ul {
padding-left:10px;
list-style:none
}
/*用户中心*/
.title-02 .user-menu {
padding-left:41px;
list-style-type:circle;
}
.title-02 .user-menu a {
font-size:14px; /*用户中心左列表文字大小*/
}
.title-02 li {
line-height:180%; /*用户中心左边高度*/
}
.top10-li-1 {
background-image:url(images/top_1.gif);
background-repeat: no-repeat;
background-position: 0px 4px;
padding-left:17px;
line-height:180%;
}
.top10-li-2 {
background-image:url(images/top_2.gif);
background-repeat: no-repeat;
background-position: 0px 1px;
padding-left:17px;
}
.top10-li-3 {
background-image:url(images/top_3.gif);
background-repeat: no-repeat;
background-position: 0px 1px;
padding-left:17px;
}
.top10-li-4 {
background-image:url(images/top_4.gif);
background-repeat: no-repeat;
background-position: 0px 1px;
padding-left:17px;
}
.top10-li-5 {
background-image:url(images/top_5.gif);
background-repeat: no-repeat;
background-position: 0px 1px;
padding-left:17px;
}
.top10-li-6 {
background-image:url(images/top_6.gif);
background-repeat: no-repeat;
background-position: 0px 1px;
padding-left:17px;
}
.top10-li-7 {
background-image:url(images/top_7.gif);
background-repeat: no-repeat;
background-position: 0px 1px;
padding-left:17px;
}
.top10-li-8 {
background-image:url(images/top_8.gif);
background-repeat: no-repeat;
background-position: 0px 1px;
padding-left:17px;
}
.top10-li-9 {
background-image:url(images/top_9.gif);
background-repeat: no-repeat;
background-position: 0px 1px;
padding-left:17px;
}
.top10-li-10 {
background-image:url(images/top_10.gif);
background-repeat: no-repeat;
background-position: 0px 1px;
padding-left:17px;
}
/*===========================================
页面右边
===========================================*/
#right {/*右边模块宽度*/
width: 220px;
float: right;
padding-right: 16px;/*右边模块右边距*/
margin-top:6px;/*右边模块上边距*/
}
.brands {/*右边品牌区*/
background: url(images/cat_arrow.gif) no-repeat 1px center;
border:1px #ddd solid;
width:172px;
margin-bottom:2px;
padding:5px 2px 5px 18px;
;
text-align:left;
}
.promotion_goods {
}
.new-articles { /*最新文章*/
height:125px;
min-height:125px;
}
*html .new-articles {/*最新公告模块高度*/
height:125px;
}
.new-articles span a {
color:#CD6702
}
#ECS_VOTE {
padding:0 5px;
}
.new-articles li { /*公告列表*/
white-space:nowrap;
width:200px;
line-height:160%;
text-overflow:ellipsis;
overflow:hidden;
}
/*===========================================
页面底部
===========================================*/
#footer {
width:auto;/*页脚区宽度（版权等内容）*/
clear:both;
text-align:center;
padding:10px 5px 30px 5px;
}
#footer div {
padding:12px;/*页脚垂直间距*/
}
#help {/*网站帮助区*/
width:auto;
clear:both;
margin-right: 20px;
margin-left: 20px;
margin-bottom:5px;
}
#help table { /*网站帮助区表格*/
border:1px #eee solid;
}
#help .cat-name {/*网站帮助区文章名*/
height:30px;
border-bottom:1px #F2F2DE solid;
}
#help .cat-name span {
padding-left:20px;
padding-top:3px;
font-size:14px;
font-weight:bold;
color:#CD6702;
}
#help ul {
padding:10px 2px 10px 20px;
list-style-type:circle;
}
#links {/*友情链接区*/
border: 1px solid #ddd;
width:auto;
clear:both;
margin:5px 20px;
padding:5px;
min-width:800px;
}
#links img {/*友情链接图片控制*/
border:1px #eee solid;
padding:2px;
}
#footer-article {/*联系我们、公司简介这一行的控制*/
background:#FFFFCC;
border-top:1px #ccc solid;
border-bottom:1px #ccc solid;
text-align:center;
padding:6px;
margin-top:3px;
min-width:800px;
}
#footer-article a {/*公司简介、联系我们这些文字的间距*/
padding:0 10px;
}
#footer-top {/*点击回到网页最上面的位置*/
float:right;
margin-top:-22px;
margin-right:40px;
}
h1 {
margin-top: 0;
}
.last {
margin-bottom: 0;
}
.clearing {
height: 0;
clear: both;
}

回答：
继续完善嘛,还有很多没写..呵..加油.支持....

好贴，收藏了

兄弟,好样的,顶你

好好学习天天向上

好贴，对新手帮助就大啦

兄弟，好样的！我挺你

好贴呀.

LZ辛苦了.
这么多都拿出来了.

verygood