css 分页突出显示选择的页码答案

【问题标题】：css pagination highlight the chosen page numbercss 分页突出显示选择的页码
【发布时间】：2014-03-15 19:47:01
【问题描述】：

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

【问题讨论】：

标签： css highlight

【解决方案1】：

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

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

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

【讨论】：