解决弹性布局父元素设置高自动换行,子元素均分高度问题(align-content: flex-start)

案例:

<view class="abc"><view class="abc-item" v-for="(item,index) in 8" :key="index">看我</view>
</view>
<style lang="less">.abc{height: 100px;display: flex;flex-wrap: wrap;overflow-y: scroll;&-item{padding: 0 20rpx;margin-right: 10rpx;}}
</style>

效果
在这里插入图片描述
当循环的item大于足够多的时候(垂直的高度大于父元素的高造成可以滑动的情况下)
在这里插入图片描述
情况就很正常。
但是要在item少的情况下也要是这样的效果。
这个时候就需要用到align-content: flex-start;
在这里插入图片描述

对于vue也是一样的解决办法。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/694950.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Web基础②nginx搭建与配置

目录 一.Nginx概述 1.定义 2.Nginx模块作用 &#xff08;1&#xff09;main模块 &#xff08;2&#xff09;stream服务模块 &#xff08;3&#xff09;邮件服务模块 &#xff08;4&#xff09;第三方模块 &#xff08;5&#xff09;events模块 &#xff08;6&#xff…

Python 进阶语法:JSON

1 什么是 JSON&#xff1f; 1.1 JSON 的定义 JSON 是 JavaScript Object Notation 的简写&#xff0c;字面上的意思是 JavaScript 对象标记。本质上&#xff0c;JSON 是轻量级的文本数据交换格式。轻量级&#xff0c;是拿它与另一种数据交换格式XML进行比较&#xff0c;相当轻…

Sora--首个大型视频生成模型

Sora--首个大型视频生成模型 胡锡进于2024年2月20日认为&#xff1a;台当局怂了 新的改变世界模拟器视觉数据转换视频压缩时空补丁&#xff08;Spacetime Laten Patches&#xff09;视频生成扩展变压器算法和模型架构结语 胡锡进于2024年2月20日认为&#xff1a;台当局怂了 **T…

六大设计原则 (SOLID)

一、设计原则概述 古人云: 有道无术,术可求.有术无道,止于术. 而设计模式通常需要遵循一些设计原则,在设计原则的基础之上衍生出了各种各样的设计模式。设计原则是设计要求,设计模式是设计方案,使用设计模式的代码则是具体的实现。 设计模式中主要有六大设计原则,简称为SOL…

【云原生】持续集成持续部署

本文主要总结CI/CD的流程&#xff0c;不会详细介绍每个知识点。 啥是集成&#xff1f;啥是部署&#xff1f; 集成&#xff0c;就是把应用程序、相关环境、配置全局打包放在一个容器中的操作。部署就不解释了。 CI/CD 如果是自己手动部署的话&#xff0c;流程应该是这样的&am…

Global Gamers Challenge | 与 Flutter 一起保护地球

作者 / Kelvin Boateng 我们知道 Flutter 开发者热爱挑战&#xff0c;因此我们很高兴地宣布&#xff0c;新一轮的 Flutter 挑战赛来了&#xff01; 挑战https://flutter.cn/events/puzzle-hack Global Gamers Challenge 是一项为期 8 周的比赛&#xff0c;参赛者需要设计、构建…

零到大师:嵌入式Linux学习书单分享

大家好&#xff0c;我是知微&#xff01; 上一篇推荐的书单嵌入式软件必读10本书_单片机篇&#xff0c;收到反响很好。再推荐一篇嵌入式Linux相关的书单。 《鸟哥的Linux私房菜》 鸟哥的Linux系列适合零基础小伙伴&#xff0c;从电脑基础到文件系统、shell脚本等等&#xff…

基于机器学习的青藏高原高寒沼泽湿地蒸散发插补研究_王秀英_2022

基于机器学习的青藏高原高寒沼泽湿地蒸散发插补研究_王秀英_2022 摘要关键词 1 材料和方法1.1 研究区概况与数据来源1.2 研究方法 2 结果和分析2.1 蒸散发通量观测数据缺省状况2.2 蒸散发与气象因子的相关性分析2.3 不同气象因子输入组合下各模型算法精度对比2.4 随机森林回归模…

Netty-核心组件

核心组件 1.Bootstrap和ServerBootstrap2.Future和ChannelFuture3.Channel4.Selector5.NioEventLoop6.NioEventLoopGroup7.ByteBuf8.ChannelHandler9.ChannelHandlerContext10.ChannelPipeline 1.Bootstrap和ServerBootstrap Bootstrap是Netty的启动程序&#xff0c;⼀个Netty…

Modern C++ std::variant的实现原理

前言 std::variant是C17标准库引入的一种类型&#xff0c;用于安全地存储和访问多种类型中的一种。它类似于C语言中的联合体&#xff08;union&#xff09;&#xff0c;但功能更为强大。与联合体相比&#xff0c;std::variant具有类型安全性&#xff0c;可以判断当前存储的实际…

SQL注入:堆叠注入-强网杯[随便注]

目录 什么是堆叠注入&#xff1f; 强网杯-随便注 rename && alter绕过 prepare绕过 Handle绕过 靶机&#xff1a;BUUCTF在线评测 什么是堆叠注入&#xff1f; 在一些场景中&#xff0c;应用程序支持一次执行多条SQL语句&#xff0c;我们称为堆叠查询&#xff0c;…

MyBatis-Plus:通用分页实体封装

分页查询实体&#xff1a;PageQuery package com.example.demo.demos.model.query;import com.baomidou.mybatisplus.core.metadata.OrderItem; import com.baomidou.mybatisplus.extension.plugins.pagination.Page; import lombok.Data; import org.springframework.util.St…

MYSQL数据库详解

一、数据库的基本概念 数据&#xff08;data&#xff09;&#xff1a;指对客观事物进行描述并可以鉴别的符号。这些符号是可识别的&#xff0c;抽象的。 比如数字、图片、音频等。 数据库管理系统&#xff08;DBMS&#xff09;&#xff1a;数据库极其管理它的软件组成。 数据库…

机器人内部传感器阅读笔记及心得-位置传感器-电位器式位置传感器

位置传感器 位置感觉是机器人最基本的感觉要求&#xff0c;可以通过多种传感器来实现。位置传感器包括位置和角度检测传感器。常用的机器人位置传感器有电位器式、光电式、电感式、电容式、霍尔元件式、磁栅式及机械式位置传感器等。机器人各关节和连杆的运动定位精度要求、重…

qt-OPENGL-星系仿真

qt-OPENGL-星系仿真 一、演示效果二、核心程序三、下载链接 一、演示效果 二、核心程序 #include "model.h"Model::Model(QOpenGLWidget *_glWidget) { glWidget _glWidget;glWidget->makeCurrent();initializeOpenGLFunctions(); }Model::~Model() {destroyV…

【Pytorch深度学习开发实践学习】B站刘二大人课程笔记整理lecture04反向传播

lecture04反向传播 课程网址 Pytorch深度学习实践 部分课件内容&#xff1a; import torchx_data [1.0,2.0,3.0] y_data [2.0,4.0,6.0] w torch.tensor([1.0]) w.requires_grad Truedef forward(x):return x*wdef loss(x,y):y_pred forward(x)return (y_pred-y)**2…

浅谈WPF之利用RichTextBox实现富文本编辑器

在实际应用中&#xff0c;富文本随处可见&#xff0c;如留言板&#xff0c;聊天软件&#xff0c;文档编辑&#xff0c;特定格式内容等&#xff0c;在WPF开发中&#xff0c;如何实现富文本编辑呢&#xff1f;本文以一个简单的小例子&#xff0c;简述如何通过RichTextBox实现富文…

Zabbix 6.2.1 安装

目录 1、监控介绍 监控的重要性 网站的可用性 监控范畴 如何监控 2、Zabbix 介绍 zabbix 简介 zabbix 主要功能 zabbix 监控范畴 Zabbix 监控组件 zabbix 常见进程 zabbix agentd 工作模式 zabbix 环境监控中概念 3、搭建LNMP 拓扑规划 安装MySQL 安装 Nginx …

【智能家居】7、主程序编写+实现语音、网络和串口功能

需要毕业论文私信有偿获取 截止目前mainPro.c代码 #include <stdio.h> #include <string.h>#include "controlDevices.h" #include "inputCmd.h"struct Devices *findDevicesName(char *name,struct Devices *phead){struct Devices *tmp=ph…

2012及其以上系统修改服务器密码指南

修改服务器密码指南,目前介绍两种不同的方案 方法一 指令式 winR键 弹出运行框里输入 cmd 点击确认或者右下角开始程序里面的点开运行 2.在弹出框里手动输入以下一组文字&#xff1a;net user administrator 123456 框内无法粘贴 需要手动输入 其中administrator 是用…