采用XHTML和CSS设计可重用可换肤网页

Visited times , Welcome to Data Mining Forum & Data Mining Expert & Data Mining Tools

4、定义站点独有的样式

　　经过以上两步之后，我们已经有了一个大概的页面主题外观，接下来我们要设计站点的细节，比如，对站点导航条我们想使用与普通超链接不一样的样式，如:蓝色、加粗、字体更大、再加上有立体效果的背景图:

. pageNav a:link, . pageNav a:hover, . pageNav a:visted (Color:#36c;
　　font-weight:bold; font-size:120%; background: url(images/bg_siteMenu.jpg) #36c;
　　)

数据挖掘交友

　　对于栏目导航，我们想给每个栏目连接加上背景色，并且有鼠标滑过和移出的效果。栏目导航区的html代码为:

数据挖掘实验室

数据挖掘研究院

                <A href="3">栏目3</A>
            <li>
                <A href="4">栏目4</A>
            <li>
                <A href="5">栏目5</A>
            <li>
                <A href="6">栏目6</A>
            </li>
        </ul> 数据挖掘工具
    </div>

数据挖掘研究院

　　栏目导航区对应的Css代码为:

数据挖掘论坛

　　.catalogNav ul
　　(
　　 margin-left: -30px;
　　 list-style: none;
　　)
　　.catalogNav li
　　(
　　 float: left;
　　 background: #CCC;
　　 line-height: 30px;
　　 border: solid 1px #black;
　　)
　　.catalogNav a
　　(
　　 width: 100%;
　　 text-align: center;
　　 height: 30px;
　　)
　　.catalogNav a:link
　　(
　　 color: #666;
　　 background: url(arrow_off.gif) #CCC no-repeat 5px 12px;

数据挖掘研究院

　　 text-decoration: none;
　　)
　　.catalogNav a:visited
　　(
　　 color: #666;
　　 text-decoration: underline;
　　)
　　.catalogNav a:hover
　　(
　　 color: #FFF;
　　 font-weight: bold;
　　 text-decoration: none;
　　 background: url(arrow_on.gif) #F00 no-repeat 5px 12px;
　　)

　　接下来我们还需要定义其他的站点独有的样式，如栏目标题、文章列表、文章正文、时间、注释、提示、错误等等各种样式，而且这些样式多以类和id来作为选择符。这些样式都是针对某个站点的，不适用于其他的站点，然后我们将这些样式保存为siteStyle.css文件。数据挖掘实验室

[数据挖掘专家] [数据挖掘研究院] [数据挖掘论坛] [数据挖掘实验室]

上一篇：CSS实例教程
下一篇：CSS中的滑动门技术

最新评论共有 0 位网友发表了评论 , 查看所有评论

发表评论( 不能超过250字，需审核，请自觉遵守互联网相关政策法规。 )

数据挖掘网站导航	数据挖掘论坛导航
数据挖掘工具数据挖掘论坛 DataCruncher - Cognos MineSet - MathSoft Intelligent Miner - GainSmarts Sqlserver - SAS - Clementine CART - Weka - WizSoft NeuroShell - ModelQuest data mining tools - Darwin 数据挖掘交友数据挖掘博客	数据挖掘工具数据挖掘资源数据挖掘技术算法数据挖掘相关期刊、会议研究院联盟合作专区数据挖掘基础与相关技术数据挖掘厂商与就业数据挖掘研究者乐园知名厂商数据挖掘工具资料国内数据挖掘实验室 Foreign Data Mining Lab