【7。1sp1风格制作】〓 CSS解析〓

蓝雨发表于 2007-6-13 13:58:00

这次的CSS变化很大，一般需要改动的地方我都做了详细解释﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏﹏/* 默认风格 */ a {text-decoration : none;color : #000000; } a:hover {text-decoration : underline; color : #4455aa; } body {font-size : 12px; color : #000000; font-family : tahoma, 宋体, fantasy; text-align : center; margin : 0; background-image : none; } td {font-family : tahoma, 宋体, fantasy; font-size : 12px; line-height : 15px; } th {background-image : url(\"skins/xx521_huo/xx521_18.jpg\"); background-color : #4455aa; color : white; font-size : 12px; font-weight : bold; line-height: normal; } th a {color : #fff; text-decoration : none; } th a:hover {color : #fff;text-decoration : underline;} .tabletitle1 {background-color : #6595d6; color : #fff;} 改变XML和WAP下面的背景颜色 .tabletitle2 {background-color : #e4e8ef; } .tablebody1 {background-color : #fff; line-height : normal; } .tablebody2 {background-color : #e4e8ef; line-height : normal; } .tablebody3 {background-color : #6595d6; } .tableborder1 {width : {$width}; border:1px none inherit; background-color : #6595d6;} .tableborder2 {width : {$width}; border : 1px solid #dedede; background-color : #efefef; margin:0 auto;} .tableborder3 {width : {$width}; border-left : 1px solid #6595d6; border-right : 1px solid #6595d6; border-top : 0px none inherit;border-bottom : 0 solid #6595d6; background-color : #efefef; } .tableborder4 {width : {$width}; border : 1px solid #6595d6;} .tableborder5 {border : 1px solid #6595d6; （XML最外框的颜色） background-color : #d6e0ef;（XML最外框下的一小圈背景颜色）} .tableborder6 {width : {$width}; border : 0 none inherit;background-color : #fff;} .singleborder {font-size : 0px;line-height : 1px;padding : 0px;background-color : #6595d6;} #tabletitleLink a {color : #fff; text-decoration : none;} #tabletitleLink a:hover {color:#fff;text-decoration : underline;} #nobold {font-weight : normal;} input , select , textarea , option {font-family : tahoma, verdana, 宋体, fantasy; font-size : 12px;line-height : 15px; color : #000000;} .normaltextSmall {font-size : 11px; color : #000000;font-family : verdana, Arial, Helvetica, sans-serif, fantasy;} .menuskin {border : 1px solid #666666; visibility : hidden; font-size : 12px;position : absolute;background-color : #efefef; background-image : url(\"{$PicUrl}dvmenubg3.gif\"); background-repeat : repeat-y;} .menuskin a {padding-right : 10px;padding-left : 25px; color : black;text-decoration : none;} .menuitems {margin : 2px; padding : 1px; text-align : left; line-height : 14pt; } .brightClass {background-color : #d7d7d7; } .redfont {color : red;} （今日发贴等红色字的颜色） .bluefont {color : #6595d6;} 小方块的颜色 .imgonclick {cursor : pointer;} .menu_popup {display : none; } .itableborder {margin:0 auto;width : {$width}; line-height : 15pt;} hr {height:0px;border :0px;border-top: #6595d6 1px solid;width : 100%; } 所有的分隔线的颜色 div.quote {margin : 5px 20px; border : 1px solid #cccccc; padding : 5px;background : #f3f3f3; line-height : normal;} div.htmlcode {margin : 5px 20px; border : 1px solid #cccccc;padding : 5px;background : #fdfddf;font-size : 14px; font-family : tahoma, 宋体, fantasy;font-style : oblique;line-height : normal;font-weight : bold;} div.info {border-top : 1px dotted #cccccc; padding : 5px;line-height : normal; color : #c5c5c5;} font.showtools {color : white; background-color : #b88ffc; } .magicframe {border : 1px solid #cccccc; } .pageinput {border : 1px solid #d6e0ef; background-color : #fafafa; height : 18px; font-family : Arial, 宋体, fantasy; font-size : 11.5px; } .copyright {color : #cccccc; line-height : 130%; } #tdleft {float:left;border-right:1px solid #6595d6; （登陆信息与论坛信息中间那条竖线的颜色）width:50%; } .mainbar1{border-left : 1px solid #6595d6; border-right : 1px solid #6595d6; width : {$width}; min-width :760px; margin : 0 auto;border-top : 1px solid #6595d6;(查看新贴用户列表等上的那一条线的颜色） border-bottom : 1px solid #6595d6; (查看新贴用户列表等下的那一条线的颜色） line-height:25px;background-color : #E4E8EF;(查看新贴用户列表等的背景颜色颜色）height:25px;} .mainbar{border-left : 1px solid #6595d6;（改变最左上的半条线的颜色） border-right : 1px solid #6595d6; （改变最右上的半条线的颜色）width : {$width}; min-width :760px; margin : 0 auto;line-height:22px;background-color : #fff;} .mainbar0{width : {$width};min-width :760px;margin : 0 auto; line-height:22px;background-color : #fff;} .mainbar2{border-left : 1px solid #6595d6;（版块列表最左边下半条线的颜色） border-right : 1px solid #6595d6; （版块列表最右边下半条线的颜色）width : {$width};min-width :760px; margin : 0 auto;border-bottom : 1px solid #6595d6;（版块列表最底下那条线的颜色） line-height:22px;background-color : #E4E8EF; (斑竹下面的那一长条的背景颜色） } .mainbar3{border-left : 1px solid #6595d6; （友情链接和论坛在线情况的最左边的那条线）border-right : 1px solid #6595d6; （友情链接和论坛在线情况的最右边的那条线）border-bottom : 1px solid #6595d6;（友情链接和论坛在线情况的最底下的那条线）width : {$width};min-width :760px; margin : 0 auto;background-color : #fff;（背景色）} .mainbar4{border-left : 1px solid #6595d6;（分页面版主左边那条线的颜色） border-right : 1px solid #6595d6;（分页面版主右边那条线的颜色）border-top : 1px solid #6595d6;（分页面版主上面那条线的颜色） width : {$width};min-width :760px;margin : 0 auto;background-color : #fff;height:25px;line-height:25px;} .index_left_states{border-right : 1px solid #6595d6; （改变论坛状态图标右边的那条线的颜色）width :46px;float:left;height:60px;background-color : #fff;} .index_right{float:right;width :240px;text-align : left; line-height:25px;} .index_left_states img{margin-top:28px;} .boardlogo{float:right;margin-top:4px;margin-right:5px;border:0px;} （版块图片的样式） #topbar_top{background-image : url(\"{$PicUrl}css/default/topbg.gif\"); height:9px;line-height:9px;font-size : 0px;color : #6595d6;} #topbar_mid{height:70px;text-align : left;background-color : #fff;} #topbar_bottom{background-image : url(\"{$PicUrl}css/default/bottombg.gif\");height:9px;line-height:9px;font-size : 0px;color : #6595d6;} #topbar_menu{background-image : url(\"{$PicUrl}css/default/tabs_m_tile.gif\"); height:22px;line-height:22px;text-align : left;} #topbar_mid_l{width:25%;float:left;margin-left:1px;margin-top:5px;min-width:180px;} #topbar_mid_m{width:60%;float:left;margin-top:5px;min-width:468px;} #topbar_mid_r{float:right;margin-top:5px;min-width:90px;line-height:15pt;text-align :right;margin-right:5px;} .menudiv1{float:left;margin-left:2px;height:20px;line-height:20px;background : url(\"{$PicUrl}navspacer.gif\") no-repeat;text-indent:8px;}（首页菜单条分隔图片的样式） .menudiv2{float:left;margin-left:2px;height:20px;line-height:20px;text-indent:8px;} div.th{border: 1px solid #6595d6; （改变th上的那条横线的颜色） border-bottom : 0px; width : {$width};min-width :760px;margin : 0 auto;background-image : url(\"{$PicUrl}css/default/bg1.gif\");（改变th的背景） background-color : #4455aa; color : white;font-size : 12px;font-weight : bold;height : 26px;line-height : 26px; text-align : left;text-indent: 5px;} div.th div{height : 26px;line-height : 26px;text-align : center;text-indent:0px; } div.th a {color : #fff;text-decoration : none; } div.th a:hover {color : #fff;text-decoration : underline; } div.th img{border:0px;margin-top:9px;} .bottomline{height :24px;line-height :24px;border-bottom : 1px solid #6595d6;float:left;} #rules{border-bottom : 1px solid #6595d6;text-align : left; line-height : 15px; } 版规下面那条线的颜色 #rulesbody{text-indent:24px;padding:10px;} .list1{float:left;width:32px;border-right : 1px solid #6595d6;} 回复人气状态旁边的那条线的颜色 .list_r{float:right;width:400px;border-left : 1px solid #6595d6; } 帖子列表th样式背景作者左边的那条线的颜色 .list{border-left : 1px solid #6595d6; （帖子列表左边的那条线的颜色）border-right : 1px solid #6595d6;（帖子列表右边的那条线的颜色）border-bottom : 1px solid #6595d6;（帖子列表底下的那条线的颜色）width : {$width};min-width :760px;margin : 0 auto;background-color : #fff; （贴子标题列表的背景颜色） height:26px;line-height:26px;text-align : left;overflow :hidden;} .list div{height:26px;overflow :hidden;} .list_s{float:left;text-align : center;width:32px;border-right : 1px solid #6595d6; （帖子列表状态图片右边那条线的颜色） background-color :#e4e8ef; （帖子列表状态图片下的背景颜色） } .list_s img{margin-top:6px;} .list_a{float:left;text-align : center;width:80px;border-right : 1px solid #6595d6; （帖子列表作者右边那条线的颜色） background-color : #e4e8ef; （帖子列表作者的背景颜色）} .list_c{float:left;text-align : center;width:50px;border-right : 1px solid #6595d6; （帖子列表回复和人气右边的那条线的颜色） background-color : #fff;（帖子列表回复和人气的背景颜色） } .list_t{float:left;text-align : center;width:120px;margin-left:5px;} .list_r1{float:right;width:400px;border-left : 1px solid #6595d6;(贴子列表作者左边的那条线的颜色） background-color : #e4e8ef; （最后更新的背景颜色） } .list_img{float:left;text-align : center;} .list_img img{margin-left:2px;margin-top:8px;margin-right:8px;border:0px;} form{margin:0px;} #posttopic{width:85px;height:26px;float:left;background-image : url(\"{$PicUrl}postnew.gif\"); margin : 2px;cursor:pointer;} （发表新贴的图标样式） #postvote{width:85px;height:26px;float:left;background-image : url(\"{$PicUrl}votenew.gif\"); margin : 2px;cursor:pointer;} （发新投票的图标样式） #postpaper{width:85px;height:26px;float:left;background-image : url(\"{$PicUrl}xzb.gif\"); margin : 2px;cursor:pointer;} （发小字报的图标样式） #repost{width:85px;height:26px;float:left;background-image : url(\"{$PicUrl}mreply.gif\");margin : 2px;cursor:pointer;} （回复此帖的图标样式） #postalipay{width:85px;height:26px;float:left;background-image : url(\"{$PicUrl}alipay.gif\"); margin : 2px;cursor:pointer;} （发起交易的图标样式） .main{width : {$width};min-width :760px;margin : 0 auto;} #boardmaster{margin-top:2px;text-align : left;} #boardmaster a{margin-right:2px;} #masterpic{float:left;width:20px;height:20px;margin-top:3px;background-image : url(\"{$PicUrl}team2.gif\"); } （分页版主图标的样式） #boardmanage{float:right;margin-right:2px;} #subject{text-align :left;text-indent:5px;} #subject img{margin-top:5px;} .listexpression{margin-left:2px;margin-top:2px;margin-right:8px;float:left;} .filetype{margin-top:5px;margin-right:8px;float:left;} .listtitle{float:left;} .listtitle div{float:left;} .listtitle img{margin-top:5px;margin-right:8px;float:left;} .postlary1{border: 1px solid #6595d6; （帖子内容外框表格线的颜色样式一）width : {$width}; min-width :760px;margin : 0 auto;background-color:#fff;（贴子内容背景颜色一）text-align : left;} .postlary2{border: 1px solid #6595d6;（帖子内容外框表格线的颜色样式二） width : {$width}; min-width :760px;margin : 0 auto;background-color:#E4E8EF;（贴子内容背景颜色二） text-align : left; } .postuserinfo{float:left;width:190px;text-indent:24px;} .post{border-left: 1px solid #6595d6;margin-left : 190px;min-height:300px;padding:10px;} .postie{border-left: 1px solid #6595d6; （帖子内容和快速回复中间的那一长条竖线的颜色） margin-left:190px;height:300px;padding:10px;} .postbottom1{width : {$width};min-width :760px;margin : 0 auto;background-color:#fff;（帖子内容页IP以及引用回复菜单那一条的背景颜色样式一）height:28px;line-height:28px;border-left: 1px solid #6595d6;（帖子内容页快速回复上的最后一个帖的最左边的那条线的颜色样式1）border-right: 1px solid #6595d6;（帖子内容页快速回复上的最后一个帖的最右边的那条线的颜色样式1）text-align : left; } .postbottom2{width : {$width};min-width :760px;margin : 0 auto;height:28px;line-height:28px;background-color : #e4e8ef; （帖子内容页IP以及引用回复菜单那一条的背景颜色样式二） border-left: 1px solid #6595d6; （帖子内容页快速回复上的最后一个帖的最左边的那条线的颜色样式2）border-right: 1px solid #6595d6;（帖子内容页快速回复上的最后一个帖的最右边的那条线的颜色样式2）text-align : left; } #postend{border-bottom : 1px solid #6595d6;} 帖子内容页快速回复上的最后一个帖的最下面的那条线的颜色 .lockuser{height:30px;line-height:30px;width:150px;border: 1px solid #6595d6;border-top:3px double #6595d6;text-align : center;color:#00008B;margin :240px 0px 0px 10px;background-color : #e4e8ef;float:right;} .vote{float:left;border-left: 1px solid #6595d6; （投票帖中间的那条线的颜色） height:28px;} .li1{border-left : 1px solid #6595d6; line-height : 28px;height : 28px;} .li2{border-left : 1px solid #6595d6; line-height : 28px;height : 28px;background-color : #e4e8ef;}

页: [1]

蓝雨动力's Archiver

【7。1sp1风格制作】〓 CSS解析 〓

【7。1sp1风格制作】〓 CSS解析〓