我爱小程序
| 问题模块 | 框架类型 | 问题类型 | 操作系统 | 工具版本 |
|---|---|---|---|---|
| 开发者工具 | 小程序 | 需求 | Windows | 1.02.1902010 |
想要一个这样效果的布局
但是我的图片不能居中 要怎么写
代码如下：
wxml：
<view class='table'>
<view class='t1'>
<image class='img_icon' src='../../images/hy.jpg'></image>
<button bindtap="gotomeeting">会议系统</button>
</view>
<view class='t1'>
<image class='img_icon' mode='scaleToFill' src='../../images/hy.jpg'></image>
<button bindtap="gotomeeting">会议系统</button>
</view>
</view>
<view class='table'>
<view class='t1'>
<image class='img_icon' src='../../images/hy.jpg'></image>
<button bindtap="gotomeeting">会议系统</button>
</view>
<view class='t1'>
<image class='img_icon' mode='scaleToFill' src='../../images/hy.jpg'></image>
<button bindtap="gotomeeting">会议系统</button>
</view>
</view>
wxss：
.table
{
display: flex;
flex-direction: row;
align-items: center;
margin-top: 0px;
}
.t1
{
width: 50%;
border: 1px solid gray;
align-items: center;
}
.img_icon
{
width: 200rpx;
height: 200rpx;
align-items: center;
}
还有就是 有什么其他写法吗？我这个写法是不是很蠢
网友回复
只是想让图片居中吗？
那可以这样写：
.img_icon{
display:block;
width:200rpx;
height:200rpx;
margin:auto;
align-items:center;
}