Skip to main content
aytonwest
Known Participant
March 21, 2018
Answered

Bootstrap 4 navbar driving me nuts

  • March 21, 2018
  • 3 replies
  • 6132 views

Hello folks.

Can some one tell me how to change the background colour of the Bootstrap Navbar in DW CC 18.1?

I have tried adding CSS as a separate style and also tried by taking over the existing .navbar CSS in the new stylesheet.

Thanks

Joe

This topic has been closed for replies.

3 replies

aytonwest
aytonwestAuthor
Known Participant
March 22, 2018

Thank you for the responses. So I take it its not possible to change the background in Dreamweaver? Web design is becoming increasingly devoid of any chance of creativity!!

J

pziecina
Legend
March 22, 2018

aytonwest  wrote

Web design is becoming increasingly devoid of any chance of creativity!!

Not true.

The user of a framework such as bootstrap is isolated from the actual code, unless of course you wish to learn what and where all the id's, classes , selectors, etc of the 100kb+ of css that is part of the framework are, and what they do. An almost impossible task that I am certain no one does.

Whilst I could just say that the isolation of the user from the code is just one of the many drawback of using frameworks such as bootstrap. What I will advise instead, is that in order to find which css rule is controlling the background colour one could use the browsers built in developer tools to do so.

To learn how to isolate a css rule using the browser dev tools, simply do a search for -

'using [insert your browsers name] developer tools'.

Your other alternative if you know which element(s) in the html to target, is of course to create your own class to target the navbar and then change the color using that.

aytonwest
aytonwestAuthor
Known Participant
March 22, 2018

pziecina, that is a very helpful response.. Thanks :-)

Nancy OShea
Community Expert
Community Expert
March 21, 2018

aytonwest  wrote

Can some one tell me how to change the background colour of the Bootstrap Navbar...

For a quick change in colors, use a Bootwatch Theme.  Presently there are 21 to choose from.

https://bootswatch.com/

Simply replace your current ink to Bootstrap default CSS with the Bootwatch theme of choice.

https://www.bootstrapcdn.com/bootswatch/

<!--Bootswatch Solar Theme from MaxCDN-->

<link href="https://maxcdn.bootstrapcdn.com/bootswatch/4.0.0/solar/bootstrap.min.css" rel="stylesheet" integrity="sha384-05+VJtAaH13TDtIHikH0vJFqCdHB4VPg9dYfcALIbTdOSDwSL299oJ173uQBedD5" crossorigin="anonymous">

Nancy O'Shea— Product User & Community Expert
BenPleysier
Community Expert
BenPleysierCommunity ExpertCorrect answer
Community Expert
March 21, 2018
Wappler is the DMXzone-made Dreamweaver replacement and includes the best of their powerful extensions, as well as much more!