- The re-styled navbar looks much better,…but I think you could do with some visual interests…around the brand.…That's this Yosemite, here, this text.…So, select the brand.…It's selected the navbar brand.…That's exactly what we want.…So, in the CSS designer we need to make sure that…Yosemite.css is selected.…Then, in the @Media pane we need to select GLOBAL…because we want to apply this outside the media queries.…So, we'll apply to all resolutions.…

Then, we need a new selector.…So, click the + button in the Selectors pane.…Dreamweaver suggests a selector based on the context.…It's a bit too specific.…So, if you press the up arrow a couple of times,…we're left with the navbar-brand class…which is exactly what we want.…Then, press Enter or Return to confirm that.…If this Show Set checkbox is selected,…deselect that so we can use the visual tools.…

It's the background that we want to change.…So, that's the fourth icon at the top.…Select that and then Background Image alongside URL…we need to select for that.…We need to go to the images folder,…

Resume Transcript Auto-Scroll

Author

Released

12/1/2015

Bootstrap—the popular HTML, CSS, and JavaScript framework for building responsive mobile-first websites—has been fully integrated into Dreamweaver CC 2015. The combo puts responsive web design within reach of all Creative Cloud members. This project-based course will show you how to define a Bootstrap layout grid in Dreamweaver, and build a responsive webpage using Bootstrap components and Dreamweaver's column tools. Author David Powers also shows how to add a hero image to your front page, create placeholder content with the text editor Emmet, and go straight to the DOM to move page elements around, avoiding the need to restructure the HTML.