Was soll ich tun, wenn der Prozentsatz der CSS-Höheneinstellung nicht wirksam wird?

Der Grund, warum es nicht wirksam wird: Die Höhe des übergeordneten Elements ist nicht bestimmt, sodass der Stil „height:XX%“ nicht effektiv verwendet werden kann. Lösung: Verwenden Sie das Höhenattribut, um eine bestimmte Höhe für das übergeordnete Element festzulegen, damit der Prozentsatz der Höheneinstellung des untergeordneten Elements wirksam werden kann.

Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.

Wenn wir reaktionsfähige Höhen für Elemente auf Blockebene festlegen, z. B. height:50% für Divs, können wir den Effekt oft nicht erkennen.

Der Grund dafür ist, dass die prozentuale Größe relativ zur Breite und Höhe des übergeordneten Elements ist. Beispielsweise entspricht der vom äußersten Element festgelegte Prozentsatz dem Bildschirm.

Was Sie verstehen müssen, ist, dass für die Breite das übergeordnete Element den Prozentsatz festlegen kann, ohne die Breite zu bestimmen.

Aber die Höhe ist unterschiedlich. Wenn das übergeordnete Element eines Elements die Höhe nicht bestimmt, beträgt die Höhe: XX %. Stil kann nicht effektiv eingesetzt werden! ! !

Nachdem ich den obigen Absatz gelesen hatte, habe ich versucht, body{heigh: 100 %} hinzuzufügen, aber es war nutzlos ...

Lassen Sie uns sorgfältig darüber nachdenken~~~, die Höheneinstellung des übergeordneten Elements von body Bist du schon unten? ? ? ? ? ? Nein~~Es hat also immer noch keine Auswirkung

Wir müssen also immer noch die Höhe des HTML-Elements festlegen! ! Oder legen Sie den Höhenprozentsatz in *{} fest.

Der Code lautet wie folgt:

*{
	margin:0px;
	padding: 0px;
}
html,body{
	margin: 0px;
	background:url(../img/body_bg.jpg) no-repeat 0 0;
	width:100%;
	height:100%;
}
.nav{
	width:100%;
	height:20%;
	border: 1px solid red;
}
.nav>img{
	width:100%;
	height: 100%;
}

Weitere Programmierkenntnisse finden Sie unter:

Programmiervideo! !

Das obige ist der detaillierte Inhalt vonWas soll ich tun, wenn der Prozentsatz der CSS-Höheneinstellung nicht wirksam wird?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!