Optimizing for a specific device
CSS media queries enable us to filter out devices based on a set of parameters. We have met in the last chapter many parameters that were hard set defined as "yes" or "no". For example, a device could only be a hand held device or not. In this chapter we move away from boolean expressions and move into a rich world of values starting with the width and height expressions. In this lecture we will be introduced to the way to work with expressions.
Keynotes:
- How to define media query expressions.
- Combining multiple expressions.
- Designing for a specific device(such as an iPhone X).
properties:
media queries, HTML4, CSS2.1, width, height, and, expressions, iphone, design for device, device-width, device-height, device-aspect-ratio
Ready to Level Up Your Skills?
Join thousands of learners on 02GEEK and start your journey to becoming a coding expert today!
Enroll Now for Free!What is responsive Design?
By the end of this lecture you will know the differences between them and by the end of this chapter you will have the tools needed to create responsive designs.
04:30
Optimizing for a specific device
In this lecture we will be introduced to the way to work with expressions.
07:52
Creating responsive designs with size ranges
By the end of this lesson, you will know how to work with the min/max prefixes to create responsive designs.
07:42
Mobile responsiveness
By the end of this lesson you will learn about how to optimize mobile responsive design and how to update the orientation of the design based on device orientation.
06:58
Backward compatibility
There is a limit to how far in history we will be able to support our layout but there are some things we can do to extend the support to older browser and that will be our main topic.
03:51