Saya mencuba perkara seperti overflow:auto dan margin-left, tetapi overflow:auto akan memotong sebahagian daripada sebelah kiri div dan apabila panjang div meningkat, margin-left tidak akan berfungsi, adakah yang lebih baik s Pilihan. Seperti yang ditunjukkan dalam kod di bawah, anda tidak dapat melihat teks.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>
</title>
</head>
<style>
body{
min-height: 100vh;
display: flex;
justify-content: center;
margin: 0 ;
align-items: center;
flex-direction: column;
overflow: auto;
}
h1{
width: 2500px;
min-height: 300px;
background: pink;
color: black;
}
</style>
<body>
<h1>This is h1</h1>
</body>
</html>
![[Web front-end] Permulaan pantas Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Masalah dengan kod anda ialah anda memusatkan item secara menegak secara flex.
Ini menyebabkan div bergerak ke kiri, di luar sempadan halaman. Memandangkan tiada cara untuk menatal di luar sempadan kiri halaman, bahagian div tersebut menjadi tidak boleh diakses.
Anda boleh menyelesaikan masalah ini dengan memastikan bekas flex cukup lebar. Tambahkan garisan berikut pada gaya badan: