Change navbar color in twitter bootstrap 2.0.4

前端 未结 6 784
情歌与酒
情歌与酒 2020-12-12 13:48

Was wondering if anyone knew how to change the navbar color in bootstrap v2.0.4

I tried this solution it does not seem to work: navbar color in Twitter Bootstrap

6条回答
  •  忘掉有多难
    2020-12-12 14:03

    The color of the navbar come from the .navbar-inner lines 3582 to 3589 in bootstrap.css (for the version 2.0.4)

    .navbar-inner in boostrap.css

    The css properties are applied in a specific order

    • background-color (recognised by all web browser)
    • vendor prefixes -moz, -ms, -webkit, -o (to serve specific web browser)
    • the standard (but not implemented yet)

    Example of background-color override in boostrap.css with Chrome:

    background-color:#ffffff; has been replaced with background-color:#eab92d directly into boostrap.css (it's not recommended but it's just to illustrate the point).

    background-color: #EAB92D is applied first

    -moz-linear-gradient and -ms-linear-gradient are ignored

    -webkit-gradient cover background: #EAB92D(back to the default gradient)

    -webkit-linear-gradient overrides -webkit-gradient

    -o-linear-gradient and linear-gradient are ignored

    .navbar-inner with backgroud-color replaced

    .navbar-inner with backgroud-color replaced result

    Change the color of .navbar-inner from colorzilla

    You can easily create a cross browser gradient with colorzilla

    Create a