Pourquoi devriez-vous utiliser des mises en page Rem

le rem unité est utilisée pour définir les polices en termes relatifs plutôt qu’avec une taille absolue en pixels. Mais saviez-vous que cette unité est utile pour les mises en page et la typographie??

Dans ce didacticiel vidéo de mon cours CSS Layout, vous apprendrez pourquoi l’utilisation de rem unités pour mises en page.

Les avantages des mises en page Rem

 

Dans le cours de mise en page CSS, toutes nos spécifications de mise en page sont définies à l'aide du rem unité. Comme nous l’avons mentionné plus en détail dans le cours de typographie, un rem unité est un multiple de la taille de la police racine de votre page.

le rem Cette unité est utile non seulement pour la typographie, mais également pour votre mise en page, et je vais vous montrer pourquoi vous devriez utiliser rem unités lorsque vous configurez votre mise en page. 

Commençons par regarder l'exemple de page sur lequel nous travaillons:

Si je change ensuite la taille de la police dans le navigateur, vous pouvez voir que la taille de la police augmente sur la page:

Maintenant, si j'augmente sans cesse la taille de la police et que je rafraîchis, vous pouvez maintenant voir que la mise en page complète s'est adaptée pour prendre en compte la taille de police plus grande.. 

Tout est encore lisible, et c'est possible car en utilisant rem unités pour configurer toute notre mise en page, nous nous assurons que tout est flexible en fonction de la taille de la police racine de notre document, qui provient des paramètres du navigateur.

Dans le même sens, si je réduisais la taille de la police à une taille vraiment réduite et que je rafraîchissais une fois de plus, vous pouvez voir que la mise en page entière avait de nouveau été réduite.. 

Donc, en utilisant ces rem unités, nous nous assurons que lorsqu'un utilisateur modifie la taille de la police, non seulement le texte lui-même change en conséquence, mais aussi l'ensemble de la mise en page..

Regarder le cours complet

Dans le cours complet, Commencez ici: Apprendre la mise en forme CSS, vous allez mettre en pratique ce que vous avez appris dans cette vidéo en créant diverses mises en page à l'aide de rem unités. Vous apprendrez tout ce que vous devez savoir pour créer les types de mises en page les plus courants dans la conception Web. Nous aborderons le dimensionnement, l'alignement, l'espacement et les meilleures pratiques pour la création de CSS réactif.

Si vous commencez à peine et que vous souhaitez maîtriser CSS, consultez Learn CSS: The Complete Guide..

Vous pouvez également expérimenter plusieurs cours de notre série "Start Here" pour les débutants en conception Web:

  • Commencez ici: Apprenez les bases du HTML
  • Commencez ici: Apprendre la typographie CSS
  • Commencez ici: Apprenez les couleurs et les arrière-plans CSS