Comment garder les marges gauche et droite des divs avec des largeurs non fixées toujours 1rem?

Compétences de mise en page de la page Web: Gardez les marges gauche et droite de l'incertain Div toujours 1M

Dans la conception Web, il est un problème courant de garder les marges gauche et droite d'un élément div avec une largeur non fixée à 1Rem. Les pourcentages d'utilisation directe entraîneront des changements de marge en raison des modifications de la taille de l'écran, ce qui n'est pas une solution idéale. Cet article fournit une méthode efficace qui ne nécessite pas de pourcentages.

Question: Comment garder ses marges gauche et droite toujours à 1rem dans une div adaptative de largeur sans être affectée par la taille de l'écran?

Solution: utilisez des unités rem pour définir les propriétés margin-left et margin-right . rem est relative à la taille de la police de l'élément racine HTML. Tant que la taille de la police de l'élément racine est fixe, rem ne changera pas.

Le code CSS suivant peut être implémenté:

 div {
  marge-gauche: 1rem;
  marge-droite: 1rem;
  Color en arrière-plan: bleu; / * Facultatif, utilisé pour faciliter la visualisation des effets * /
}

Ce code définit les marges gauche et droite de l'élément div sur 1Rem. Les marges resteront les mêmes, quelle que soit la façon dont la largeur de la div change. background-color: blue; est uniquement utilisé pour les effets de démonstration et peut être supprimé dans des applications réelles.

Grâce à cette méthode, il est facile de réaliser une disposition div avec une largeur adaptative et des marges gauche et droite fixée.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!