To recap responsive design is used to making a website that is able to respond to devices that it’s being showed on.
The goal is to make single website that is responsive to something around the device it’s displayed on.
In regards to media queries it allows to modify our styles depending on the particular parameters like the screen width or device types.
It also adds or changes style sheets depending on the display.
An example to show how media queries work is
@media ( max-width: 800px){ .sidebar { display:none;
}
To note a useful point: If you go in toggle device toolbar you can do a short cut: shift m and it shows different command surface display with phones or tables and even laptops.
Comments