What does this media query do exactly

Question

Can someone explain how this media query works?

/* Tablet Portrait (768px) */
@media only screen and (min-width: 321px) and (max-width: 1024px) and (orientation: portrait)

Answer 1

It's rules apply only to screen devices with a minimum width of 321px, a maximum width of 1024px and a screen orientation of portrait.

In practice, this would be a tablet sized screen (bigger than 320px wide) when it is in portrait.

Answer 2

Rules apply only on screens (not on printers etc.) when with of deivce: 321px < device-width < 1024 and portrait orientation.