Ich versuche, zwei Leinwand zusammen zu stapeln und daraus eine Leinwand mit zwei Ebenen zu machen.
Ich habe hier ein Beispiel gesehen:
<div style="position: relative;">
<canvas id="layer1" width="100" height="100"
style="position: absolute; left: 0; top: 0; z-index: 0;"></canvas>
<canvas id="layer2" width="100" height="100"
style="position: absolute; left: 0; top: 0; z-index: 1;"></canvas>
</div>
Aber ich möchte beide Leinwand in der Mitte des Bildschirms ausrichten. Wenn ich den Wert left
als Konstante einstelle , während ich die Ausrichtung des Bildschirms ändere (während ich Aps auf dem iPad mache), bleibt die Leinwand nicht in der Mitte des Bildschirms, wie sie sich verhält
<div align="center">
Kann mir bitte jemand helfen?
css
html5-canvas
PaulLing
quelle
quelle
left: 80px;
wird das Objekt 40px (!) Rechts von der Mitte verschoben.Wenn Sie ein Element zentrieren möchten, ohne dessen Breite und Höhe zu kennen, gehen Sie wie folgt vor:
Beispiel:
quelle
Haben Sie versucht, zu verwenden?:
Ich bin mir nicht sicher, ob es funktionieren wird, aber es ist einen Versuch wert ...
Kleinere Änderungen : Der Teil am linken Rand wurde hinzugefügt, wie in den Kommentaren von Chetan ...
quelle
margin-left: <negative half the width>
quelle
Probieren Sie diese Methode aus und funktionieren Sie gut für mich
quelle
Alles was du tun musst, ist,
Stellen Sie sicher, dass Ihr Eltern-DIV die Position: relativ hat
und das Element, das Sie zentrieren möchten, legen Sie eine Höhe und Breite fest. Verwenden Sie das folgende CSS
quelle
Verschieben Sie das übergeordnete Div mit in die Mitte
Bewegen Sie die zweite Ebene mit über die andere
quelle