Q1: What are media queries used for in web design? To have the aplication responsive in all devices
Q2: What is the syntax for a media query? @media only screen and (min/max-width: ${number}px)
Q3: How do you specify a media type in a media query? can be min or max after adding '@media only'
Q4: What is the purpose of the min-width property in a media query? To apply responsive css to any dimension greater than min-width point
Q5: What is the purpose of the max-width property in a media query? To apply responsive css to any dimension less than max-width point
Q6: How do you specify multiple conditions in a media query? With 'and' after declaring min-width or max-width or orientation
Q7: What is the purpose of the orientation property in a media query? Changes viewport between landscape (row) or portrait (column)
Q8: How do you target high-resolution displays using media queries? Using CSS breakpoints
Q9: What is the purpose of the only keyword in a media query? Different browsers might see screen, color and other properties as screen media type
Q10: How can you test your media queries during development? You can change window size for your browser, or toggle device on chrome inspect tools