Good morning everyone and welcome to the sixth installment of the css coursewhich aims to learn how to modify and tune the CSS of our website.
To see the videos you can, and you will have access not only to this course, but also to
Today we will see how responsive websites that adapt to mobile devices and screens of various dimensions work, thanks to CSS media queries.
6.1 – Theory of Media Queries
Let’s start with the theory. It will only take us 5 minutes, but we need to understand what media queries are and where and how we should put the code.
So, you see that the theory is simple. We just have to put all the CSS rules inside that CSS conditional so that it only applies in those cases.
6.2 – Practice of Media Queries
Now let’s see how it works in practice. Let’s see how by modifying the code we can alter the responsiveness of any website. Let’s tinker with the code!
As you can see, the operation is easy and simple, and the flexibility is unlimited. Now that we know how to change any property depending on the screen in which it is being displayed, we only have to choose if we want an element to the right or below, if we want to see it or hide it, or if we want it bigger or smaller. Imagination to the power. Use the Chrome Inspector as I have told you and experiment with any website.
And then I recommend that you also take a look at the links that I have left you under the video and try those codes on any site, or on your own, and check it on your devices. You already have homework! In the next class… More! 😉
Remember that if you will have access to everybody the courses and you can also enjoy everything from .
Facebook Comments
Disqus