<view class="sticky-box"> <view class="item" v-for="(item, index) in explosiveMoney" :key="index"> <video src="item.video" ></video> </view> </view>设置view标签下的视频样式信息,将视频设置为纵向排列,视频位置居中
时间: 2023-10-04 14:13:44 浏览: 146
react-sticky-box:各种大小的内容物的便签盒
可以使用以下样式设置view标签下的视频样式信息:
```css
.sticky-box {
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.item {
margin-bottom: 20px;
}
video {
max-width: 100%;
height: auto;
}
```
其中,`.sticky-box` 类设置了 `display: flex`,将其子元素按照主轴方向(默认为水平方向)排列,`flex-direction: column` 将其子元素纵向排列,`justify-content: center` 和 `align-items: center` 分别使其子元素在主轴和交叉轴上居中对齐。
`.item` 类设置了 `margin-bottom: 20px`,用于在视频之间添加一定的间距。
`video` 标签设置了 `max-width: 100%`,将视频宽度设置为与其容器相同,`height: auto` 则保持视频的高宽比不变。
阅读全文