我是 Web 开发的初学者，我正在尝试垂直对齐 p 元素中心下方，但它不起作用，有人可以帮助我吗
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"></script>
<style>
p{
top: 50%;
transform: translateY(-50%);
}
</style>
</head>
<body>
<header class="d-flex flex-column align-content-center bg-secondary py-5">
<div class="d-flex">
<img src="img/Icons-14.png">
<p>hgjsafakfjlajflksjf</p>
</div>
</header>
</body>
</html>
试试这个：
d-flex {
position:relative;
}
p {
position: absolute
top: 50%;
transform: translateY(-50%);
}
或者试试这种方式：
d-flex {
display:flex;
align-items:center;
}