Nasıl html5 canvas merkezi
Bir süre bir çözüm için şimdi aradım, ama hiçbir şey bulamadı. Belki sadece arama şartlarım var. Peki, canvas merkezi yapmak için tarayıcı penceresinin boyutuna göre çalışıyorum. Tuval 800x600. Ve eğer pencerenin altında olursa 800x600, (ama şu anda çok önemli değil) boyutunu
Şimdiden teşekkürler, Jorgen
CEVAP
Tuval aşağıdaki css ver üslup özellikleri:
canvas {
padding-left: 0;
padding-right: 0;
margin-left: auto;
margin-right: auto;
display: block;
width: 800px;
}
Edit
Bu cevap oldukça popüler olduğu için, bana biraz daha detay ekleyelim.
Yukarıda özellikleri olacakyatay olarakmerkezi ana göre ne gerekiyorsa tuval, div. Üst veya alt kenar boşlukları ve doldurma değiştirmeye gerek yok. Sana bir genişlik belirleyin ve tarayıcı izin otomatik kenar boşlukları ile kalan boşluğu doldurmak.
Eğer yazın daha az istiyorsanız ancak, ne olursa olsun istediğiniz gibi kullanabilirsiniz
canvas {
padding: 0;
margin: auto;
display: block;
width: 800px;
}
Tuval ortalamadikey olarakancak farklı bir yaklaşım gerektirir. Mutlak konumlandırma kullanmak, ve genişlik ve yükseklik her ikisi de belirtmeniz gerekir. Daha sonra 0, sol, sağ, üst ve alt set özellikleri ve tarayıcı otomatik kenar boşlukları ile kalan boşluğu doldurmak izin.
canvas {
padding: 0;
margin: auto;
display: block;
width: 800px;
height: 600px;
position: absolute;
top: 0;
bottom: 0;
left: 0;
right: 0;
}
Tuval eğer hiçbiri bulunursa relative
absolute
tüm vücut için position
ayarlanmış olan ilk ana öğe dayalı kendi merkezi olacak.
Başka bir yaklaşım İE11 kullanılabilir display: flex
, kullanmak olacaktır
Ayrıca, xhtml veya html 5 gibi son bir doctype kullandığınızdan emin olun.
Nasıl metin yatay ve dikey olarak Andr...
HTML5/Canvas kullanarak ekran görüntül...
Nasıl merkezi bir "position: abso...
Nasıl 3 divs (/merkezi/Sağ-Sol) başka ...
Nasıl dikey olarak merkezi UİTextField...