CSS3 @media juge à la fois la largeur et la hauteur

définition

À l'aide de la requête @media, vous pouvez définir différents styles pour différents types de médias.
@media peut définir différents styles pour différentes tailles d'écran , en particulier si vous devez concevoir une page responsive, @media est très utile.
Lorsque vous réinitialisez la taille du navigateur, la page sera de nouveau rendue en fonction de la largeur et de la hauteur du navigateur.

utilisation

Si vous devez  évaluer la largeur et la hauteur en même temps , vous pouvez utiliser l'   opérateur and .

Le code suivant juge que la  hauteur est inférieure à 500px et la largeur est supérieure à 600px

@media screen and (max-height: 500px) and (min-width:600px){
    
    .toc{
        display:none
    }
    
    header, main {
            margin-left: 2em;
            margin-bottom: 3em;
    }
}

Je suppose que tu aimes

Origine blog.csdn.net/qq_34626094/article/details/113034296
conseillé
Classement