Join David Powers for an in-depth discussion in this video Hide elements, part of Dreamweaver CC: Responsive Design with Bootstrap 4.
- [Instructor] Dreamweaver makes it easy…to hide elements in a Bootstrap page selectively,…depending on the size of the viewport.…Typically, you might want to hide less important elements…on extra small devices.…So let's resize this page to extra small…and you may want to get rid of these icons…on an extra-small device.…So select that icon, right-click,…and then from the context menu, Hide Element.…And it's gone.…Again, with this one,…right-click, Hide Element,…and that one is gone too.…
But they'll be hidden only on extra-small devices.…If we go to the next break point,…just click to the right of 576 pixels,…those icons are back.…But let's say you change your mind,…let's go back to that other break point.…And then right-click and from the context menu,…Manage Hidden Elements.…And these are now displayed…with that hatching.…And if you select that,…there's this little eye icon down below…which will unhide the element.…
But before doing that,…let's just take a look at the classes…that have been applied to this particular icon.…
- Defining a layout grid
- Inserting and modifying a navigation bar
- Adding a container for the page content
- Inserting a responsive image
- Resizing and duplicating columns
- Inserting fixed-size images
- Inserting cards
- Editing a carousel
Skill Level Intermediate
Designing Websites from Photoshop to Dreamweaverwith Sue Jenkins2h 27m Intermediate
Bootstrap 4 Layouts: Responsive Single-Page Designwith Ray Villalobos3h 13m Intermediate
Design the Web: Responsive SVG Imageswith Chris Converse22m 46s Beginner
Bootstrap 4 Essential Trainingwith Ray Villalobos5h 57m Beginner
What you should know1m 46s
1. Get Started
2. Create the Site Navigation
3. Add a Hero Image
4. Work with Rows and Columns
5. Edit Bootstrap Components
6. Complete the Design
Next steps1m 55s
- 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.