Pourquoi la définition de la hauteur minimale sur le corps par CSS n'a-t-elle aucun effet ?

Quand il y a très peu de contenu dans la zone de contenu de la page Web, le pied de page ira en haut ?
J'ai défini min-height:100%; pour le corps et le html, mais cela n'a aucun effet
Définissez la hauteur: 100% et c'est bien, mais s'il y a trop de contenu, il tiendra sur un seul écran. ?

body,html{   min-height:100%;
}body{   position:relative;
}.content{  podding-bottom:100px;
}.footer{position:absolute;bottom:0;left:0;height:100px;
}

Écrivez comme ceci :

html {    
height: 100%;
}
body {    
position: relative;    
min-height: 100%;   
 box-sizing: border-box;    
 padding-bottom: 80px; /* .footer 的高度，为 footer 占位 */}
 .footer {    
 position: absolute;    
 bottom: 0;    
 left: 0;    
 width: 100%;    
 height: 80px;
}

Le code ci-dessus est compatible avec IE8 et supérieur

J'ai également rencontré un tel problème et je l'ai résolu comme this :

html,body，.content{    
min-height:100%;
}
html{    
-ms-text-size-adjust: 100%;    
-webkit-text-size-adjust: 100%;
}
body{    
background:#eeeeee;
}

Ensuite, utilisez le contrôle js pour créer $(".content").height($("html").height); Je pense que cet ajustement est plus fiable

100 % est comparé en fonction de son élément parent, par exemple

<div style="width:100px;">
    <div style = "width:50%;"></div>
</div>

Retour à la question de l'affiche originale, donc le HTML ne peut définir qu'une hauteur fixe. Si vous souhaitez définir le pourcentage de taille du corps, vous devez d'abord le faire. définissez la hauteur de l'élément HTML !

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!