JSP页面美化技巧——CSS翻页代码经典示例
5星
- 浏览量: 0
- 大小:None
- 文件类型：None
简介：
本文章介绍了使用CSS美化JSP页面的方法，并提供了经典的分页代码实例。通过这些技巧可以轻松提升网站的美观度和用户体验。
以下是重新编写的CSS翻页代码：
```css
body {
font-size: 12px;
font-family: Verdana, Arial, Helvetica, sans-serif;
width: 60%;
padding-left: 25px;
}
/* CSS Digg style pagination */
.digg {
padding-right: 3px;
padding-left: 3px;
padding-bottom: 3px;
margin: 3px;
text-align: center
}
.digg a {
border-right: #aaaadd solid 1px;
padding-right: 5px;
border-top: #aaaadd solid 1px;
color: #000099;
text-decoration: none;
padding-left: 5px;
padding-bottom: 2px;
margin: 2px;
border-left: #aaaadd solid 1px;
padding-top: 2px;
border-bottom: #aaaadd solid 1px
}
.digg a:hover {
border-right-color:#000099 ;
border-top-color :#000099;
color:#000;
border-left-color :#000099;
border-bottom-color: #000;
}
.digg a:active {
border-right-color:#3366FF ;
border-top-color :#3366FF;
color:#fff;
border-left-color :#3366FF;
border-bottom-color: #3366FF
}
.digg span.current {
font-weight:bold;
background-color: #000099;
padding-right:5px ;
margin:2px ;
color:#fff;
padding-left : 5px;
border-bottom-width:1px;
border-top-width :1px;
border-right-width :1px;
padding-top : 2px ;
padding-bottom : 2px ;
margin-left :0 ;
float:left
}
.digg span.disabled {
background-color:#eee;
color: #ddd;
padding-right:5px ;
border-width:1px solid #eee;
margin-top : 2px ;
padding-bottom : 2px ;
padding-left : 5px ;
float:left
}
```
这段代码用于创建一个类似Digg网站风格的分页导航，适用于需要实现美观和实用性的网页设计。
全部评论 (0)
