在 Joomla 3.0 中修改 Protostar 模板菜单类

Question

我在 Joomla 3.0 网站上使用 Protostar 模板，并且对修改其 template.css 文件中的样式有疑问，以使可折叠的垂直菜单对链接的文本使用相同的类颜色样式/行为我对全角水平菜单有什么。我不熟悉默认 template.css 文件中指定的所有几十个类（例如，所有 .nav 和 .navbar 类）。通过在 user.css 文件中使用自定义类，我可以确定背景颜色，并使链接文本颜色之一相同，但我坚持需要更改的其余样式。我一直在使用 Firebug，但还没有找到方法。

这是一个album of six screenshots，显示两个菜单的三个阶段。同样，我需要让垂直菜单使用与水平菜单相同的文本样式/行为。

我想通过使用自定义 user.css 文件仅修改适当类所需的样式来解决此问题，因为如果可能的话，我不想直接更改默认 template.css 文件.

（一个相关的问题，虽然不是那么关键，但是如何减少垂直菜单项之间的边距。）

因此，我们将不胜感激任何帮助。这是我需要为这个网站完成的最后一项，所以我很想弄清楚这一点。提前致谢！

Answer 1

Joomla 3.x Protostar 使用 Bootstrap 2.3.2v 并为桌面和平板电脑/移动视图具有不同的 css 样式。 您需要使用引导媒体查询来设置它的样式。例如：

@media (max-width: 979px) {
     /* menu item color */
    .nav-collapse .nav > li > a,
    .nav-collapse .dropdown-menu a {
        color: #0000ff;
    }

    /* space between menu element */
    .nav-collapse .nav > li > a,
    .nav-collapse .dropdown-menu a {
        padding: 3px 15px;
        margin-bottom: 0;
    }
}

您可以在documentation 找到有关引导媒体查询媒体查询的更多信息