There are a few things I couldn’t understand in this exercise’s css.
For instance:
@media only screen and (max-width: 590px) {
h1 {
font-size: 4rem;
}
}
They have not been explained before on my full stack career path. What’s with the @ selector and the following keywords?
This is a media query. In this particular case, it is saying “for screens smaller than 590px
across, apply the following styling (the h1{font-size: 4rem;}
).”
Essentially, media queries can be used to make websites responsive; they can set conditions for certain CSS rules, based off things to do with the screen (resolution, width, height, etc).