html media code example

Example 1: media queries les plus utilisees

/* Sur les écrans, quand la largeur de la fenêtre fait au maximum 1280px */
@media screen and (max-width: 1280px)

/* Sur tous types d'écran, quand la largeur de la fenêtre est comprise entre 1024px et 1280px */
@media all and (min-width: 1024px) and (max-width: 1280px)

/* Sur les téléviseurs */
@media tv

/* Sur tous types d'écrans orientés verticalement */
@media all and (orientation: portrait)

Example 2: css @media

/* When the width is between 600px and 900px OR above 1100px */
@media screen and (min-width: 600px) and (max-width: 900px), (min-width: 1100px) {
  div.example {...}
}

Example 3: media query in html style

span { background-image: url(particular_ad.png); }

@media (max-width: 300px) {
    span { background-image: url(particular_ad_small.png); }
}