今天先记下,以后有机会在分析,学习样式 表这样写的好处和不足。
@charset "utf-8"; /*文字色*/ /* 基本正文字色(博文正文文字默认颜色) */ body{ color:#323e32;} /* 基本链接字色(默认链接) */ a, a:link, a:visited, a:hover, .SG_more{color:#074387} /* A类文字色 (同默认链接,特殊情况下定义样式用) */ .SG_txta{color:#074387} /* B类文字色(举例:正文标题下面的标签、分类) */ .SG_txtb{color:#637160} /* C类文字色(举例:正文标题后面的时间) */ .SG_txtc{color:#637160} /* 提示性文字色A(红色,一般不处理) */ .SG_clewtxta{color: #FF0000} /* 提示性文字色B(橙色,一般不处理) */ .SG_clewtxtb{color: #FF6600} /* A类链接色(同body色即可) */ .SG_linka a:link, .SG_linka a:visited, .SG_linka a:hover, a.SG_linka:link, a.SG_linka:visited, a.SG_linka:hover{ color:#323e32;} /* B类链接色(同C类文字色即可) */ .SG_linkb a:link, .SG_linkb a:visited, .SG_linkb a:hover, a.SG_linkb:link, a.SG_linkb:visited, a.SG_linkb:hover{color:#637160} /* 边框颜色(内容区投票等模块)*/ .borderc{ border-color: #343143; } /* 博客标题文字色*/ .sinabloghead .blogtitle, .sinabloghead .blogtitle a, .sinabloghead .blogtitle a:link, .sinabloghead .blogtitle a:visited, .sinabloghead .blogtitle a:hover, .sinabloghead .blogtitle .CP_a_fuc{color:#ffffff} .sinabloghead .bloglink, .sinabloghead .bloglink a, .sinabloghead .bloglink a:link, .sinabloghead .bloglink a:visited, .sinabloghead .bloglink a:hover{ color:#f4f4f6;} .sinabloghead .bloglink .CP_a_fuc{color:#e9e9ed} /* 导航文字色 */ .sinabloghead .blognav a, .sinabloghead .blognav a:link, .sinabloghead .blognav a:visited, .sinabloghead .blognav a:hover{ color:#d2d2da} /*导航选中状态*/ .sinabloghead .blognav a.on, .sinabloghead .blognav a.on:link, .sinabloghead .blognav a.on:visited, .sinabloghead .blognav a.on:hover{color:#ffffff} /* 组件标题颜色 */ .SG_connHead .title, .SG_connHead .title a, .SG_connHead .title a:link, .SG_connHead .title a:visited, .SG_connHead .title a:hover, .SG_connHead .tip, .SG_connHead .tip a, .SG_connHead .tip a:link, .SG_connHead .tip a:visited, .SG_connHead .tip a:hover, .SG_connHead .edit, .SG_connHead .edit a, .SG_connHead .edit a:link, .SG_connHead .edit a:visited, .SG_connHead .edit a:hover, .SG_connHead .tip_r, .SG_connHead .tip_r a, .SG_connHead .tip_r a:link, .SG_connHead .tip_r a:visited, .SG_connHead .tip_r a:hover, .SG_connHead .fontSize, .SG_connHead .fontSize a, .SG_connHead .fontSize a:link, .SG_connHead .fontSize a:visited, .SG_connHead .fontSize a:hover, .menuList ul li.current, .menuList ul li.current a, .menuList ul li.current a:link, .menuList ul li.current a:visited, .menuList ul li.current a:hover, .menuList ul li.current em.SG_txtc{ color:#e6ebeb} /* 标准尾文字色 */ .sinablogfooter, .sinablogfooter a:link, .sinablogfooter a:visited, .sinablogfooter a:hover{ color:#b7b7c4} /* 按钮文字颜色 */ a.SG_aBtn, a.SG_aBtn:link, a.SG_aBtn:visited{color:#323e32;} /* 页签链接颜色(非选中)*/ .SG_tag ul li span a, .SG_tag ul li span a:link, .SG_tag ul li span a:visited, .SG_tag ul li span a:hover{ color:#efeff2;} /***********************************************************************/ /* 背景图*/ /* 背景 */ body{ background-color: #1e1f47; /* 循环背景图 background-image:url(); */ } /* 头图 (背景、高度)*/ .sinablogb{background-image: url(../../../image/5/5_11/images/sinablogb.jpg); } .sinabloghead{height: 266px;} /* 尾图 (背景、高度) */ .sinabloga{ background-image: url(../../../image/5/5_11/images/sinabloga.jpg);} .sinablogfooter{ height:190px;} /* 标题 (位置)*/ .sinabloghead .blogtoparea{ top:33%; left:219px;} /* 导航 (背景、位置、大小、间距)*/ .sinabloghead .blognav{top: 76%; left: 140px; width: 413px; height: 40px;} .sinabloghead .blognav .blognavInfo{ top:14px;*top:16px;left:68px;} /* 针对ie6下的滤镜要用绝对路径*/ .sinabloghead .blognav .blognavBg{ background-image:url(../../../image/5/5_11/images/blognavbg.png); _background-image:none; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true, sizingMethod=crop, src='http://simg.sinajs.cn/blog7newtpl/image/5/5_11/images/blognavbg.png');} /* 导航文字间隔线*/ .sinabloghead .blognav span{ padding:0 13px;*padding:0 12px;background-image:url(../../../image/5/5_11/images/sg_newsp.png);} /* gif图用于当组件透明时,ie6下不透明的效果 */ /* 组件标题栏 */ .SG_colW95 .SG_connHead, .SG_colW73 .SG_connHead, .SG_colW51 .SG_connHead, .SG_colW21 .SG_connHead, .blogads .ad_head{ background-image: url(../../../image/5/5_11/images/modelhead.png); } /* 组件标题栏高度 */ .SG_colW95 .SG_connHead, .SG_colW73 .SG_connHead, .SG_colW51 .SG_connHead, .SG_colW21 .SG_connHead{height:26px} /* 组件背景 */ .SG_colW95 .SG_connBody, .SG_colW73 .SG_connBody, .SG_colW51 .SG_connBody, .SG_colW21 .SG_connBody, .blogads .ad_body{background-image: url(../../../image/5/5_11/images/modelbody.png); } /* 组件底边 */ .SG_colW95 .SG_connFoot, .SG_colW73 .SG_connFoot, .SG_colW51 .SG_connFoot, .SG_colW21 .SG_connFoot, .blogads .ad_foot{background-image: url(../../../image/5/5_11/images/modelfoot.png); } /* 组件底边高度 */ .SG_colW95 .SG_connFoot, .SG_colW73 .SG_connFoot, .SG_colW51 .SG_connFoot, .SG_colW21 .SG_connFoot{height:1px} /* 实线&虚线 */ .SG_j_line, .SG_j_line1 { background-image: url(../../../image/5/5_11/images/SG_line.gif);} .SG_j_linedot, .SG_j_linedot1{ background-image: url(../../../image/5/5_11/images/SG_linedot.gif);} /* 小圆点 */ .SG_dot{ background-image:url(../../../image/5/5_11/images/SG_dot.gif);} /* 页签 */ .SG_tag, .SG_tag ul li, .SG_tag ul li span.tagR, .SG_tag ul li.current, .SG_tag ul li.current span.tagR{background-image:url(../../../image/5/5_11/images/sg_newsp.png); } /* 二级菜单 (选中状态)*/ .menuList ul li.current, .menuList ul li.current .menuCell_bot{background-image:url(../../../image/5/5_11/images/sg_newsp.png);} /* 评论条底图 */ .allComm .allCommTit{ background-image:url(../../../image/5/5_11/images/sg_newsp.png);} /* 按钮 背景 */ a.SG_aBtn,a.SG_aBtn cite{ background-image: url(../../../image/5/5_11/images/sg_newsp.png);} /***********************************************************************/ /* 恢复浮层按钮颜色 */ a.SG_aBtnB, a.SG_aBtnB cite{ color:#333399; background-image: url(http://simg.sinajs.cn/blog7style/images/common/sg_btnb.png); _background-image: url(http://simg.sinajs.cn/blog7style/images/common/sg_btnb.gif);} a.SG_aBtn_dis, a.SG_aBtn_dis cite{ background-image:url(http://simg.sinajs.cn/blog7style/images/common/sg_btn_dis.png);_background-image:url(http://simg.sinajs.cn/blog7style/images/common/sg_btn_dis.gif);} /* 预留商业皮肤相关样式、克隆按钮、商业logo等 */ .sinabloghead .adsarea{ display: none; right:0; bottom:50px;} .sinabloghead .adsarea .pic{display:none;} .sinabloghead .adsarea .link{ color:#FFFFFF;} .sinabloghead .adsarea .link a, .sinabloghead .adsarea .link a:link, .sinabloghead .adsarea .link a:visited, .sinabloghead .adsarea .link a:hover{color: #0099FF;} .sinabloghead .adsarea .other{display:none} /* 头图区域动画(注意这儿的宽高跟swf文件和头图区域都要保持一致)*/ .sinabloghead .headflash{ width:950px; height:265px;}