En ce moment on voit de plus en plus des thèmes dit Responsive, c’est dire qui permet de redimensionner automatiquement votre site en fonction de la taille de l’écran afin d’être parfaitement optimisé pour tout types d’appareil.

Il existe plusieurs techniques ( JQuery, CSS,….)

Sur mon site vous pouvez le voir en action si vous le rétrécissez la page.

La façons la plus pour le mettre en place et pour qu’il soit optimum c’est de le faire en CSS.

Je vais vous expliquer

Tout d’abord le code HTML

et le code CSS

.row {width:900px; height:900px; background-color: red;}

@media only screen and (max-width: 1280px) {
  .row {width:800px; height:800px; background-color: black;}
}

Nous voyons que de base notre div ROW sera de couleur rouge est fera une taille de 900 x 900 px par défaut.

Cependant, dés que le site sera redimensionner en dessous de 1280 px, la couleur ainsi que la taille de ma DIV changeront en fonction de ce que l’on a mis dans notre CSS.

Vous pouvez voir le résultat ici

Vous pouvez faire de même en ajoutant du texte en fonction de la taille

HTML

  
Be 

CSS

@media (max-width: 1280px) {
  .row h2 span:after { content: 'Monster at 1280.' }
}
@media (max-width: 980px) {
  .row h2 span:after { content: 'Bigger at 980.' }
}

Ici, le texte entre les balises changera en fonction de la taille

Exemple ici