Override Bootstrap CSS in Yii2

问题

I have a NavBar and I want to override all the classes that Yii is putting on that widget. After searching inn Google and reading the docs, I found that this code:

Yii::$container->set('yii\bootstrap\NavBar', [
    'containerOptions' => [
        'class' => ''
    ]
]);

NavBar::begin([
    'containerOptions' => [
        'class' => 'no-horizontal-padding navbar-content'
    ]
]);

is supposed to override (delete, actually) all classes in the container of my NavBar, but this is not the case. I keep seeing my 2 classes and the default NavBar classes.

How can I remove those classes and keep only mine?

Please refrain any hacky solutions like removing the classes with JS on the client side. I'm looking for a proper way of doing this.

EDIT:

I'm adding the generated HTML as requested:

<nav id="w0" class="navbar-inverse navbar" role="navigation">
    <div class="container-fluid no-horizontal-padding">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#w0-collapse">
                <span class="sr-only">Toggle navigation</span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
        </div>
        <div id="w0-collapse" class="no-horizontal-padding navbar-content collapse navbar-collapse">
        </div>
    </div>
</nav>

回答1:

If you want to remove collapse and navbar-collapse out of the box, using the widget parameters, you can't.

As you can see in the code for the NavBar component in Yii2, those classes are hard-coded in there.

Your options:

Modify the Navbar.php file and remove this classes (not recommended).
Write directly in HTML your navbar (not ideal, but is a valid workaround).
Create your own custom Navbar Component for Yii2 (recommended, because you can copy the Navbar.php file, remove those classes and change the namespace).

Here is a simple tutorial for creating your components and using them.

来源：https://stackoverflow.com/questions/29950716/override-bootstrap-css-in-yii2

标签

php

html

css

twitter-bootstrap

yii2