Join David Powers for an in-depth discussion in this video Hiding elements, part of Dreamweaver CC 2015: Responsive Design with Bootstrap.
The way Bootstrap is being integrated into Dreamweaver…makes it very easy to hide elements selectively…depending on the size of the view port.…Typically, you'll want to hide…less important elements on extra small devices.…I've re-sized the document window to show the layout…of the page we've built as it'll look on a viewport…less than 650 pixels wide.…And I'd like to hide a couple of the articles…in the highlights section.…So, let's just scroll down.…And I'm going to hide this Great Outdoors,…so just click anywhere in there.…
I've selected that H2.…We need to select the parent element,…that's the column, and a quick way to select the parent…element in live view is to hold down…the control key on Windows or the Command key on a Mac…and press left, square bracket.…That gives us the article, that's the whole column there.…To hide it, just right-click…and select "hide element" and it's gone.…So, let's do that with another one.…Let's do it with Birdwatching.…Again, select the parent element, the whole column.…
Then, right-click and "hide element".…
- Defining a custom Bootstrap layout grid
- Inserting and modifying a navigation bar
- Adding a container for a hero image
- Working with columns inside a Bootstrap container
- Creating placeholder content with Emmet
- Speeding up layout by duplicating columns
- Moving page elements in the DOM
- Previewing the mobile webpage with Device Preview
Skill Level Intermediate
1. Getting Started
2. Creating the Site Navigation
3. Adding a Hero Image
Inserting the hero image6m 37s
4. Working with Columns
5. Using Device Preview
What next?2m 5s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.