css分页突出显示所选页码

时间:2013-08-09 13:17:48

标签: css highlight

我正在寻找一种使用css突出显示所选页码的方法, 或者将所选页码加粗。

分页php代码工作正常,所以我想我应该修改css页面。

我应该在这里添加什么:

body
{
padding:50px;
font-size:0.85em;
font-family:arial;
}

a
{
text-decoration:none;
color:#0080ff;
}

a:hover
{
text-decoration:underline;
}



.info
{
line-height:150%;
width:650px;
overflow:auto;
margin-top:30px;
color:#555555;
}

.msg
{
padding:10px;
border-bottom:dashed 1px #5d478b;
width:450px;
margin-bottom:15px;
}

#pages
{
clear:both;
list-style-type:none;
overflow:hidden;
margin:0;
padding:0;
}

#pages li
{
float:left;
}

#pages li a
{
font-weight:bold;
margin:0 4px;
padding:5px 10px;
border:1px solid #bbb;
display:inline-block;
border-radius:5px;
}

#pages li a:hover
{
text-decoration:none;
color:#ff0080;
}

1 个答案:

答案 0 :(得分:0)

您在帖子中缺少有关为分页生成的html的信息。

我从你的CSS中假定每个页面链接都是具有id页面的元素中的列表项内的锚点。我将假设选定的锚点上有某种类,让我们说“选中”。在你的css中添加这样的东西:

#pages li a.selected
{
    font-weight: bold;
    background-color: yellow;
}