Bagaimana untuk memastikan butang kelihatan berpusat pada resolusi komputer yang berbeza
P粉974462439
2023-08-13 18:51:08
<p>Resolusi Mudah Alih</p>
<p>Jadi saya menggunakan bootstrap dan berjaya memusatkannya, tetapi apabila saya menukar resolusi/mengecilkannya, butang membalut dan bergerak sedikit ke kanan, bolehkah sesiapa memberitahu saya apa yang saya lakukan salah? </p>
<pre class="brush:php;toolbar:false;">--HTML--
<div class="d-grid gap-2 col-2 mx-auto text-center">
<button id="Get" class="btn btn-outline-success btn-lg" type="button">Muat naik terkini</button>
--CSS--
#Dapatkan {
lebar sempadan: 4px;
font-family: Lexend;
}</pre>
<p>Saya cuba memusatkannya, ia berfungsi untuk resolusi yang lebih besar tetapi dialihkan ke kiri pada resolusi mudah alih</p>
Anda boleh mencuba kedudukan relatif
position: relative
添加到父级<div>
,然后将绝对定位position: absolute
添加到按钮,并加上left: 50%; top: 50%; transform: translate(-50%, -50%);
.Dengan cara ini kedudukan butang akan bebas daripada resolusi dan saiz skrin. Harap ini menyelesaikan masalah anda.