Heim > Artikel > Web-Frontend > Lösung für das Problem der Div-Höhe 100 % unter Deklaration
Lösung für das Problem der Div-Höhe 100 % unter Deklaration
- 高洛峰Original
- 2017-03-23 09:08:142514Durchsuche
Wenn Sie HTML-Code zum Erstellen einer Webseite verwenden und 8b05045a5be5764f313ed5b9168a17e6 deklariert ist und ein Div im Code eine Höhe von 100 % hat, kann es zu einer abnormalen Anzeige kommen. Zum Beispiel der folgende Code:
<!DOCTYPE HTML>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
* {margin:0px;padding:0px;}
div {
background-color:red;
width:200px;
height:100%;
}
</style>
</head>
<body>
<div></div>
</body>
</html>Das angezeigte Ergebnis ist: Nichts! Warum?
Der Grund dafür ist, dass der HTML5-Standard dies erfordert, wenn die Höhe oder Breite auf einen Prozentsatz eingestellt ist , das übergeordnete Tag wird referenziert. Wenn Sie diesen Satz verstehen, lässt sich das Problem leichter lösen. Das übergeordnete Tag des 6c04bd5ca3fcae76e30b72ad730ca86d ist naiverweise der Meinung, dass die Höhe des 6c04bd5ca3fcae76e30b72ad730ca86d nicht definiert, dass das dc6dce4a544fdca2df29d5ac0ea9906b angezeigt wird. Fügen Sie einen Parameterkörper {height:100%;} in CSS hinzu, Vorschau, das Ergebnis ist: immer noch nichts
Warum? Obwohl die Höhe des 6c04bd5ca3fcae76e30b72ad730ca86d-Tags auf 100 % eingestellt ist, ist das 6c04bd5ca3fcae76e30b72ad730ca86d-Tag das 100db36a723c770d327fc0aef2ce13b1-Tag und die Höhe dieses Tags muss ebenfalls definiert werden. Die letzten hinzuzufügenden Parameter sind also html, body {height:100%;}
Bitte beachten Sie, dass zwischen html und body ein Komma und kein Leerzeichen steht. Erklären Sie, dass es sich um einen Multi-Label-Selektor und nicht um einen abgeleiteten Selektor handelt.
Das obige ist der detaillierte Inhalt von Lösung für das Problem der Div-Höhe 100 % unter Deklaration. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!