Question

我对CSS非常新鲜，因此我不确定如何正确命名，所以随时可以更改它。

我正在编辑this Joomla模板以在左栏显示垂直菜单（模板仅定义了垂直菜单）。 Here是定义.menu类的css文件。当我将菜单放在左栏中的模块中时，元素浮动到左边定义的here 在模块管理器中，我添加了菜单类后缀nav nav-pills nav-stacked，但nav-stacked不会覆盖浮动。

水平菜单的页面来源

<!--Navigation-->
<div id="navigation">
    <div class="container-fluid">
        <div class="navbar">
            <div class="navbar-inner">
                <a class="btn btn-navbar" data-target=".nav-collapse" data-toggle="collapse"></a>
                <div class="nav-collapse">
                    <ul class="menu">
                        <li class="item-109 current active"

垂直菜单的页面来源

<!--Left -->
<div id="sidebar" class="span3">
    <ul class="menu nav nav-pills nav-stacked">
        <li class="item-109 current active"></li>
        <li class="item-110"></li>
        <li class="item-102"></li>
    </ul>
</div>

这是我的想法如何制作 - 我想让.menu课成为navbar的孩子。如果我通过这样的事情来理解CSS中的良好继承.navbar > .menu {...}如果.menu类将出现在.navbar深处，那么它的元素将浮动到左边（并具有其他属性），如果不是，这句话menu nav nav-pils nav-stacked将“生成”垂直菜单。

Answer 1

解决方案是编写像这样的this代码

.menu > li {
    border-left: 0 solid #F2F2F2;
    cursor: pointer;
    /*float: left;*/
    font-size: 14px;
    font-weight: 300;
    padding: 0 1px 0 0;
    text-transform: uppercase;
}
.navbar .menu > li {
    float: left;
}

现在，当菜单元素包含在navbar类

中时，它们将浮动到左侧

在Joomla模板中依赖于父类的CSS类

1 个答案: