<!--index.wxml-->
<view style="transform:translateY(-80rpx)" class="transtion">
<view>0</view>
<view>1</view>
<view>2</view>
<view>3</view>
<view>4</view>
<view>5</view>
<view>6</view>
<view>7</view>
<view>8</view>
<view>9</view>
</view>
<view style="transform:translateY(-160rpx)" class="transtion">
<view>0</view>
<view>1</view>
<view>2</view>
<view>3</view>
<view>4</view>
<view>5</view>
<view>6</view>
<view>7</view>
<view>8</view>
<view>9</view>
</view>
<view style="transform:translateY(-240rpx)" class="transtion">
<view>0</view>
<view>1</view>
<view>2</view>
<view>3</view>
<view>4</view>
<view>5</view>
<view>6</view>
<view>7</view>
<view>8</view>
<view>9</view>
</view>
<view style="transform:translateY(-320rpx)" class="transtion">
<view>0</view>
<view>1</view>
<view>2</view>
<view>3</view>
<view>4</view>
<view>5</view>
<view>6</view>
<view>7</view>
<view>8</view>
<view>9</view>
</view>
<view style="transform:translateY(-400rpx)" class="transtion">
<view>0</view>
<view>1</view>
<view>2</view>
<view>3</view>
<view>4</view>
<view>5</view>
<view>6</view>
<view>7</view>
<view>8</view>
<view>9</view>
</view>
<view style="transform:translateY(-480rpx)" class="transtion">
<view>0</view>
<view>1</view>
<view>2</view>
<view>3</view>
<view>4</view>
<view>5</view>
<view>6</view>
<view>7</view>
<view>8</view>
<view>9</view>
</view>
<view style="transform:translateY(-560rpx)" class="transtion">
<view>0</view>
<view>1</view>
<view>2</view>
<view>3</view>
<view>4</view>
<view>5</view>
<view>6</view>
<view>7</view>
<view>8</view>
<view>9</view>
</view>
<view style="transform:translateY(-640rpx)" class="transtion">
<view>0</view>
<view>1</view>
<view>2</view>
<view>3</view>
<view>4</view>
<view>5</view>
<view>6</view>
<view>7</view>
<view>8</view>
<view>9</view>
</view>
<view style="transform:translateY(-720rpx)" class="transtion">
<view>0</view>
<view>1</view>
<view>2</view>
<view>3</view>
<view>4</view>
<view>5</view>
<view>6</view>
<view>7</view>
<view>8</view>
<view>9</view>
</view>
<view style="transform:translateY(-800rpx)" class="transtion">
<view>0</view>
<view>1</view>
<view>2</view>
<view>3</view>
<view>4</view>
<view>5</view>
<view>6</view>
<view>7</view>
<view>8</view>
<view>9</view>
</view>
CSS
page{
background:#000;
}
.transtion{
transition:all 3s;
display: inline-block;
}
.transtion view{
padding:0;
margin:0;
height:80rpx;
font-weight:bold;
font-size:33px;
width:30px;
display:flex;
align-items:center;
flex-direction:column;
justify-content:center;
color:#fff;
}
不能理解这个rpx为什么会有这么大出入,
苹果手机依次向下,
安卓大屏依次向上,
一部分安卓依次向下,
目前没有发现正常的 9个数全部对齐的,经过测试和手机分辨率有关,请求帮助
你可以限制数字所在的view的宽高,清除默认行间距
字体改一下,各数字的占位空间不一样,1可能比较小,0,8,9这种最大
没起作用,
....那我也不知道怎么改了
.transtion view 加个 overflow:hidden;呢
没用大哥。能帮我在本地测试下吗
能贴下android机不一致的地方吗?不是很理解你什么意思呢。。
就是每一行的数字 对不齐, 看第一行的1和9,他们两个错位了
哦哦哦。。你这个意思啊。。是这样的,rpx在真的显示的时候,会换算成px,会有误差。。正常的啊
那怎么能对齐呢, 有没有方案GOD
求指导啊 大神们