如何使用 CSS 网格属性将居中？
原文: https://www .极客们。组织/如何使用 css-grid-property/ 对中心进行划分
在本文中，我们将学习使用 CSS 的 grid 属性将一个 HTML 使用网格水平居中 < div > 元素。使用设置为网格的显示属性，即显示:网格；然后使用属性 放置-物品:居中； 示例:以下示例演示了使用网格属性将< div >设置为中心。 输出: 中心 div 使用高度 示例 2: 我们将演示一个示例，其中我们没有为设置高度 < div > 。结果将在中心但仅在 x 轴方向，而通过设置高度我们可以在两个轴上居中 < div > 。 输出: 中心在 x 轴上**HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, initial-scale=1.0">
<style>
.grid{
display: grid;
place-items: center;
color: green;
font-size: 25px;
height : 500px;
}
</style>
</head>
<body>
<div class="grid">
<p>Geeks for Geeks</p>
</div>
</body>
</html>
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, initial-scale=1.0">
<style>
.grid{
display: grid;
place-items: center;
color: green;
font-size: 25px;
}
</style>
</head>
<body>
<div class="grid">
<p>Geeks for Geeks</p>
</div>
</body>
</html>
版权属于：月萌API www.moonapi.com，转载请注明出处
