如何更改移动视图菜单中最后一个按钮的文本颜色？

Posted 2023-03-06

【中文标题】如何更改移动视图菜单中最后一个按钮的文本颜色？

【英文标题】：how can i change the text-color of the last button in my mobile view menu?

【发布时间】：2019-04-27 21:28:50

【问题描述】：

我正在使用 wordpress 发布者模板。 移动菜单的颜色应该是#051039，除了最后一个像按钮，我的问题是按钮的背景颜色是相同的#051039，所以我想把它改成白色。 我尝试通过在链接的 id 中添加额外的 css 代码来解决这个问题：

#menu-item-430 
    text-align: center;
    border-radius: 5px;
    background-color: #051039;
    color: #fff !important;

但什么也没发生。我该如何解决？ 这是我的网站： https://ijimfang.com

【问题讨论】：

您可以使用媒体查询仅在手机上应用css：w3schools.com/cs-s-ref/css3_pr_mediaquery.asp

主要问题是按钮文本颜色没有改变！

这是因为在 #menu-item-430 div 中还有另一个子 <a> 具有颜色属性。所以你必须给那个<a>标签应用颜色

谢谢。请为这个答案投票，以便我们的追随者充分利用它。

谢谢@hamidkhd13

【参考方案1】：

你可以试试这个代码。请将此代码添加到您当前激活的主题的 style.css 文件中。

@media only screen and (max-width: 600px) 
    ul#resp-navigation li:last-child
        text-align: right;
        border-radius: 5px;
        background-color: #ffffff;
        border: 1px solid #051039;
    
    ul#resp-navigation li:last-child a
        color: #fff !important
    

【参考方案2】：

使用这种风格

.rh-cover .rh-c-m .resp-menu li:last-child > a  color: #fff !important;