深圳市金黑网络技术有限公司始终坚持以用户需求为导向，提供安全、稳定、高效的产品和服务！
签到 · 搜索导航 · 服务热线 · 微信/手机：17817817816

深圳网站建设

搜索
应用资源 › 应用开发教程 › 小程序开发 › 微信小程序开发之初识flex布局进行垂直分布布局 ...
返回列表 发新帖
查看: 1083|回复: 0

微信小程序开发之初识flex布局进行垂直分布布局

[复制链接]
admin

UID
1
贡献
844
金币
1540
主题
520
在线时间
333 小时
注册时间
2022-1-15
最后登录
2024-11-12
QQ
发表于 2022-2-16 13:54:38 | 1083 | 0 | 显示全部楼层 |阅读模式
admin 2022-2-16 13:54:38 1083 0 显示全部楼层
微信小程序开发之初识flex布局进行垂直分布布局
代码如下：
  1. display: flex;
  2. flex-direction: column;
复制代码
实例：
wxml代码：
  1. <view class="container">
  2.     <image class="avater" src="/images/touxiang/1.jpg"></image>
  3.     <text>金黑出品，必属精品</text>
  4.     <view>
  5.         <text>开启小程序之旅</text>
  6.     </view>
  7. </view>
复制代码
wxss代码：
  1. .container{
  2.     display: flex;
  3.     flex-direction: column;
  4. }
复制代码
解说：flex-direction默认为row横向显示，属性改成column竖向显示。
深圳小程序定制, 小程序教程, 小程序制作, 小程序开发
楼主热帖

相关帖子
回复

举报

返回列表 发新帖
Copyright © 2013-2023 深圳市金黑网络技术有限公司 版权所有    备案号：粤ICP备2021124338号    粤公网安备 44030702003689号

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

快速回复 返回顶部 返回列表