Heim  >  Artikel  >  Web-Frontend  >  So erreichen Sie eine proportionale Skalierung der Höhe und Breite von Divs

So erreichen Sie eine proportionale Skalierung der Höhe und Breite von Divs

零到壹度
零到壹度Original
2018-03-29 13:48:219165Durchsuche


Dieser Artikel zeigt Ihnen hauptsächlich, wie Sie die proportionale Skalierung von Höhe und Breite von Divs erreichen. Er hat einen guten Referenzwert und ich hoffe, dass er für alle hilfreich sein wird. Folgen wir dem Herausgeber und werfen wir einen Blick darauf.

1. Option 1: Sie können die Höhe und Breite von p entsprechend den Medienabfragen festlegen. Die spezifischen Einstellungen hängen davon ab, wie Sie responsiv angezeigt werden möchten

@media only screen and (min-width: 100px) and (max-width: 640px) {
     div{width: 100px;
 height: 100px;
         }}@media only screen and (min-width: 641px) and (max-width: 789px) {
      div{width: 200px;
 height: 200px;
          }}
2. Option 2: Machen Sie es in Prozent. Wenn die Polsterung in Prozent gemessen wird, wird sie relativ zur Breite des Behälters berechnet, sodass Sie die Höhe festlegen können 0 und der Inhalt wird auf natürliche Weise überlaufen. ,

Stellen Sie einen Padding-Bottom ein
Höhe:0;
Breite:50%;
Padding-Bottom:30%
Dann das Seitenverhältnis davon div ist 30 %:50 %

Das obige ist der detaillierte Inhalt vonSo erreichen Sie eine proportionale Skalierung der Höhe und Breite von Divs. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
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
Vorheriger Artikel:CSS-PositionsattributNächster Artikel:CSS-Positionsattribut