html - 这个 CSS 有什么问题(尝试创建一个 "digg like"分页页脚)

标签 html css

我正在尝试为页面创建分页页脚。这是我的 Html 片段以及内部 CSS:

<html>
    <head>
       <style="text/css">
ul{border:0; margin:0; padding:0;}

#pagination-digg li{
border:0; margin:0; padding:0;
font-size:11px;
list-style:none;
margin-right:2px;
}
#pagination-digg a{
border:solid 1px #9aafe5
margin-right:2px;
}
#pagination-digg .previous-off,
#pagination-digg .next-off {
border:solid 1px #DEDEDE
color:#888888
display:block;
float:left;
font-weight:bold;
margin-right:2px;
padding:3px 4px;
}
#pagination-digg .next a,
#pagination-digg .previous a {
font-weight:bold;
}
#pagination-digg .active{
background:#2e6ab1;
color:#FFFFFF;
font-weight:bold;
display:block;
float:left;
padding:4px 6px;
}
#pagination-digg a:link,
#pagination-digg a:visited {
color:#0e509e
display:block;
float:left;
padding:3px 6px;
text-decoration:none;
}
#pagination-digg a:hover{
border:solid 1px #0e509e
}
       </style>
    </head>
    <body>
<ul id="pagination-digg">
<li class="previous-off">«Previous</li>
<li class="active">1</li>
<li><a href="?page=2">2</a></li>
<li><a href="?page=3">3</a></li>
<li><a href="?page=4">4</a></li>
<li><a href="?page=5">5</a></li>
<li><a href="?page=6">6</a></li>
<li><a href="?page=7">7</a></li>
<li class="next"><a href="?page=2">Next »</a></li>
</ul> 
    </body>
</html>

代码实际上来自本教程here ,这显然是错误的。

页脚未按应有的方式呈现,并且 mousemove 悬停事件上的闪烁似乎表明在悬停事件中正在更改填充、字体粗细或边距。

最佳答案

#pagination-digg a:hover{
border:solid 1px #0e509e;margin:-1px
}

又更新了。某些样式代码未关闭。使用 jsfiddle 中的 CSS 代码。

http://jsfiddle.net/jWbzX/2/

关于html - 这个 CSS 有什么问题(尝试创建一个 "digg like"分页页脚),我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8156814/

相关文章:

php - 如果你需要 3 个 'tiers' 的引号,你会怎么做?

html - 如何使用 CSS 更改滚动条位置?

javascript - 一张图片的不同浏览器窗口高度

javascript - 在文本区域元素上使用 onload

html - 如何删除移动 Twitter 闪屏?

css - 自定义 ionic 复选框默认背景色

javascript - 移动样式表不起作用 - wordpress

html - CSS 不适用于母版页

html - 文本不包含在没有边距的 div 中 : 0 auto

html - 文本在 HTML 输入中未正确对齐。我的代码要更改什么?