html - Cant change font color in navbar -
i cant seem change font color in navbar, other elements in navbar css works not font color reason. have tried change class other elements in css wont work. cant seem find problem, though first time using bootstrap.
css
.navbar { background-color: white; border: none; color: #0000; } .navbar-brand { font-size: 50px; }
html
<head> <title></title> <meta charset="utf=8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="css/main.css"> </head> <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar=header"> <a class="navbar-brand" href="#">travelling</a> </div> <ul class="nav navbar-nav navbar-right"> <li><a href="#">home</a></li> <li><a href="#">about</a></li> <li><a href="#">contact</a></li> </ul> </div> </div> </nav> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"> </script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"> </script> </body> </html>
.navbar { background-color: white; border: none; color: #000; } .navbar .navbar-nav li > a{ color: orange !important; } .navbar .navbar-brand { font-size: 50px; color: blue !important; }
<head> <title></title> <meta charset="utf=8"> <meta http-equiv="x-ua-compatible" content="ie=edge"> <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no"> <link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css"> <link rel="stylesheet" type="text/css" href="css/main.css"> </head> <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <a class="navbar-brand" href="#">travelling</a> </div> <ul class="nav navbar-nav navbar-right"> <li><a href="#">home</a></li> <li><a href="#">about</a></li> <li><a href="#">contact</a></li> </ul> </div> </nav> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"> </script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"> </script> </body> </html>
Comments
Post a Comment