Question

.cat_p{
    float:left; 
    margin-right:3px; 
    margin-bottom: 1px;}
.cat_p a {
    background: #00A1E0;
    color: #FFFFFF;
    display: inline-block;
    margin-bottom: 2px;
    margin-left: 0px;
    padding: 1px 7px;
    text-decoration: none;
    transition: all 0.3s ease 0s;
} 
.cat_p a:hover{
    background:  #666; 
    color:#fff;
}

这是我用来显示Wordpress文章帖子的类别和标签的代码。这在主页上非常有效，而在另一个页面（single.php）上，代码无法正常工作，因为链接显示为蓝色，这使得无法区分类别div的背景和文本。我检查了上面的代码，但找不到任何问题。我想知道是否有一种方法可以使类别div独立于上面的div，因为它们可能有问题。

Answer 1

如果CSS在其他页面中不起作用，但主页意味着其他CSS正在覆盖它。尝试并查找该页面的特定“id”或“类”以应用该CSS。通常我会去体内课，然后做：

.home,
.single-post {

    .cat_p{
        float:left; 
        margin-right:3px; 
        margin-bottom: 1px;}
    .cat_p a {
        background: #00A1E0;
        color: #FFFFFF;
        display: inline-block;
        margin-bottom: 2px;
        margin-left: 0px;
        padding: 1px 7px;
        text-decoration: none;
        transition: all 0.3s ease 0s;
    } 
    .cat_p a:hover{
        background:  #666; 
        color:#fff;
    }    
}

使用CSS

1 个答案: