小程序中如何将View按照百分比,实现等宽高效果

Posted yun382657988

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了小程序中如何将View按照百分比,实现等宽高效果相关的知识,希望对你有一定的参考价值。

1、布局

<View className='Box'>
	<View className='Box1'>
		<View className='Box2'></View>
	</View>
</View>

2、wxss

.Box
    display: flex;
    justify-content:space-between;
    flex-direction:row;

.Box1
    width:23%;
    border:1rpx solid #ccc;

.Box2
    padding-top:100%;

3、效果

以上是关于小程序中如何将View按照百分比,实现等宽高效果的主要内容,如果未能解决你的问题,请参考以下文章

微信小程序开发中如何实现侧边栏的滑动效果

使用movable-view制作可拖拽的微信小程序弹出层效果。

微信小程序中如何实现view标签中的图片居中显示,或者view居中?

第八篇微信小程序-progress组件

微信小程序view半圆怎么弄

小程序实现顶部选中效果