css - css 分页突出显示选择的页码

Question

我正在寻找一种方法来使用 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;
}

Answer 1

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

我从您的 CSS 中假设每个页面链接都是具有 id pages 的元素内的列表项中的锚点。我将假设选定的锚点上有某种类，比方说“选定”。将这样的内容添加到您的 css 中：

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