本文介绍了两种网页布局方法：一是利用父元素的`center`属性结合子元素的`inline-block`和`vertical-align: middle`实现文本居中；二是通过CSS Grid创建一个300x300px的网格容器，放置100x100px的小元素，展示网格布局和区域划分。
方法五
给父标签tent-alian:center；line-height：父标签的高；给子标签display：inline-block;vertical-align：middle；给予标签旁边添加空span
方法六
<style>
.small {
width: 100px;
height: 100px;
background-color: #f00;
grid-area: a;
}
.box {
width: 300px;
height: 300px;
border: 1px solid #000;
margin: 200px auto;
display: grid;
grid-template-rows: 100px 100px 100px;
grid-template-columns: 100px 100px 100px;
grid-template-areas: ". . ." ". a ." " . . . ";
}
</style>
<div class="box">
<div class="small"></div>
</div>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
