Comment utiliser la largeur minimale CSS

min-width vous permet de définir la largeur minimale d'un élément. Il est souvent utilisé avec la réponse de largeur maximale. Dans cet article, nous examinerons l'utilisation spécifique de min-. largeur en CSS.

Voyons d'abord ce qu'est la largeur minimale ?

L'attribut min-width permet de définir la largeur minimale d'un élément.

Comment utiliser l'attribut min-width ?

Par exemple, pour "nous permettre de visualiser facilement n'importe quelle taille de navigateur", disons que vous disposez d'un élément pour créer un site Web réactif, vous pouvez définir la largeur du contenu sur width : 30 % ;

Si vous le voyez dans un petit navigateur horizontal sur un smartphone, etc., il deviendra plus petit que la cible Même si vous n'utilisez pas spécifiquement de requêtes multimédias pour définir d'autres valeurs, vous devez utiliser une valeur numérique. (px) pour définir min -width, afin que la taille réelle ne soit pas inférieure à cette valeur.

Regardons un exemple spécifique

Si CSS est appliqué au HTML suivant, la réduction de la largeur du navigateur ne sera pas inférieure à la largeur spécifiée par max- largeur .

HTML

 <div class ="container"> 
  <div class ="box"> 
    <p>请尝试更改浏览器宽度。<br> min-width：200px;已经设置，它
    不会小于200px。</p> 
  </div>

CSS

.box{
  width: 30%;
  height: 200px;
  min-width: 200px;
  background-color: #66b6d5; 
}

L'effet est le suivant :

Cet article se termine ici C'est fini. Pour plus d'informations sur les propriétés en CSS, vous pouvez regarder le Tutoriel vidéo CSS sur le site php chinois pour apprendre ! ! !

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!