- As I mentioned during the introduction for this chapter,…media queries are one of the primary components…of a responsive web design.…In this lesson, we'll dive deeper…into media queries so that you have…a better understanding of what you're working with.…Defined in the CSS 3 spec…a media query is a recognized value…of the media attribute that allows specific…CSS rules or external style sheets to be applied…conditionally, like if the current device has a…screen of a certain width.…
You can, for example, start out with a…basic desktop design like this one…and then you can set up one of the…CSS rules that are applied if the width…of the display screen is at a minimum…768 pixels like an iPad as shown in this…simulator here or other tablet.…You can also establish another set of…CSS rules that kick in when the screen…is at least 320 pixels like an iPhone.…
There's no limit to the number of media queries…you can establish.…That's totally up to you.…Browser support for media queries is very robust…and they're increasingly being used.…
- Structuring fluid grids
- Adding a new fluid grid layout
- Adding building-block div tags
- Inserting content into a fluid grid
- Modifying the number of grid columns
- Building media queries from scratch
- Working with additional media queries
- Handling orientation changes
- Manipulating CSS
- Adding new media
Skill Level Intermediate
Edge Animate Essential Trainingwith Chris Converse4h 44m Beginner
1. Understanding Responsive Web Design
2. Fluid Grid Layouts in Dreamweaver
3. Expanding on a Fluid Grid Structure
4. Enhanced Media Queries
5. Flexible Images and Media
- 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.