Heim > Web-Frontend > CSS-Tutorial > Hauptteil

Was sind die Unterschiede zwischen negativen Werten für die vertikale Ausrichtung und negativen Werten für den unteren Rand?

青灯夜游
Freigeben: 2020-11-06 18:00:47
nach vorne
2411 Leute haben es durchsucht

Was sind die Unterschiede zwischen negativen Werten für die vertikale Ausrichtung und negativen Werten für den unteren Rand? Der folgende Artikel stellt Ihnen den Unterschied zwischen den negativen Werten von Vertical-Align und den negativen Werten von Margin-Bottom vor. Es hat einen gewissen Referenzwert. Freunde in Not können sich darauf beziehen. Ich hoffe, es wird für alle hilfreich sein.

Was sind die Unterschiede zwischen negativen Werten für die vertikale Ausrichtung und negativen Werten für den unteren Rand?

Werfen wir zunächst einen Blick auf die Werte von Vertical-Align in W3C:

Aber es wird selten erwähnt, dass es einen numerischen Wert hat. Schauen wir uns diesen Code an:


<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <style>
    .test_box {
      width: 45%;
      float: left;
      margin-right: 1%;
      background-color: #f0f3f9;
    }
    .mb-200 {
      margin-bottom: -200px;
    }
    .va-200 {
      vertical-align: -200px;
    }
  </style>
</head>
<body>
<p class="test_box">
  <img src="http://image.zhangxinxu.com/image/study/s/s128/mm1.jpg" class="mb-200" />张含韵
</p>
<p class="test_box">
  <img src="http://image.zhangxinxu.com/image/study/s/s128/mm1.jpg" class="va-200" />张含韵
</p>
</body>
</html>
Nach dem Login kopieren

Hier habe ich zwei P's geschrieben. Sie enthalten alle das gleiche Bild. Das Feld ist vollständig vom Textfluss getrennt und die Größe wird vollständig von den untergeordneten Elementen unterstützt.

vertical-align erhöht die Höhe des Containers, während negative margin-bottom-Werte sie verringern!

Weitere Kenntnisse zum Thema Programmierung finden Sie unter: Einführung in die Programmierung! !

Das obige ist der detaillierte Inhalt vonWas sind die Unterschiede zwischen negativen Werten für die vertikale Ausrichtung und negativen Werten für den unteren Rand?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
css
Quelle:cnblogs.com
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage