flex布局在多层嵌套时,内层设置了justify-content: space-between;不生效问题

 内层的地址和时间这一行,设置了justify-content: space-between;但并不生效,原因是要在上一层.center 设置 flex:1;( 重点)

经常忘记,特在此记录一下,以下是代码

<view class="index-card" @click="showDetail(item)"><view class="card-top"><u-avatar size="50" :src="this.$utils.baseUrl+'/file/download/'+item.avatar"></u-avatar><view class="center"><view><u--text size="30rpx" :lines="2" :text="item.name"></u--text></view><view class="card-bottom"><view class="location"><uni-icons type="location" size="15"></uni-icons><view class="address">{{item.city}} · {{item.address}}</view></view><view class="time">{{item.createTime}}</view></view></view></view><view class="uni-list--border-bottom"></view></view>

.index-card {padding: 15px 15px;background-color: #ffffff;margin-top: 5px;.card-top {color: $uni-color-title;display: flex;flex-direction: row;align-items: center;.center {font-size: $font-lg;margin-left: 10px;flex:1;.card-bottom {color: $font-color-light;font-size: 26rpx;margin-top: 10px;display: flex;flex-direction: row;align-items: center;justify-content: space-between;width: 100%;.location {display: flex;flex-direction: row;align-items: center;.address {width: 400rpx;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}}.time {color: $color-primary;}}}}}

 

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

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

相关文章

3D 人体研究

SynBody: Synthetic Dataset with Layered Human Models for 3D Human Perception and Modeling SynBody 是一个新的合成数据集&#xff0c;旨在推动 3D 人体研究的多样性和标注质量。它具有以下三个吸引人的特点&#xff1a; 服装参数化人体模型&#xff1a;可以生成各种不同…

数学建模、统计建模、计量建模整体框架的理解以及建模的步骤

数学建模、统计建模、计量建模整体框架的理解以及建模的步骤 引言正文模型的设定模型的估计建模中可能遇到的四种数据类型 模型的检验模型的应用 最后 引言 这篇博客主要写给统计或者数学专业的小白&#xff0c;以供快速上手建模比赛&#xff1b;本人将在这里整合参加建模比赛…

c语言:通讯录管理系统(文件版本)

前言&#xff1a;在大多数高校内&#xff0c;都是通过设计一个通讯录管理系统来作为c语言课程设计&#xff0c;通过一个具体的系统设计将我们学习过的结构体和函数等知识糅合起来&#xff0c;可以很好的锻炼学生的编程思维&#xff0c;本文旨在为通讯录管理系统的设计提供思路和…

SpringBoot配置输出的日志文件

SpringBoot配置输出的日志文件 1、无需导入依赖&#xff0c;因为我们创建springboot时&#xff0c;导入的关于springboot的依赖中已经包含了。 2、我们在项目的resources 资源文件下创建logback.xml文件&#xff0c;文件内容如下 作用&#xff1a; 如果是开发时启动的项目&a…

Python自动化测试框架pytest的详解安装与运行

这篇文章主要为大家介绍了Python自动化测试框架pytest的简介以及安装与运行&#xff0c;有需要的朋友可以借鉴参考下希望能够有所帮助&#xff0c;祝大家多多进步 1. pytest的介绍 pytest是一个非常成熟的全功能的python测试工具&#xff0c;它主要有以下特征&#xff1a; 简…

Java List 中存不同的数据类型

在最近的实践中&#xff0c;有人突然问了一个问题&#xff1a; 在 Java 的 List 中可以存不同的数据类型吗&#xff1f; 这个问题突然给问到了&#xff0c;我们都知道 Java 中的 List 中存的是对象&#xff0c;通常我们定义都会这样的定义&#xff1a; List<String> t…

大端字节序存储 | 小端字节序存储介绍

为什么存储的顺序有些变动呢&#xff1f; 大小端的介绍 我们在创建变量时&#xff0c;操作系统就会给你分配空间&#xff0c;比如你创建了【short/int/double/float】的变量&#xff0c;这些变量的类型都是大于1个字节的&#xff0c;操作系统会根据你这个变量的类型&#xff…

Java基础面试-JDK JRE JVM

详细解释 JDK&#xff08;Java Devalpment Kit&#xff09;java 开发工具 JDK是Java开发工具包&#xff0c;它是Java开发者用于编写、编译、调试和运行Java程序的核心组件。JDK包含了Java编程语言的开发工具和工具集&#xff0c;以及Java标准库和其他一些必要的文件。JDK中的…

SpringBoot 如何使用 Grafana 进行可视化监控

使用Spring Boot Sleuth进行分布式跟踪 在现代分布式应用程序中&#xff0c;跟踪请求和了解应用程序的性能是至关重要的。Spring Boot Sleuth是一个分布式跟踪解决方案&#xff0c;它可以帮助您在分布式系统中跟踪请求并分析性能问题。本文将介绍如何在Spring Boot应用程序中使…

HomeView/主页 的实现

1. 创建数据模型 1.1 创建货币模型 CoinModel.swift import Foundation// GoinGecko API info /*URL:https://api.coingecko.com/api/v3/coins/markets?vs_currencyusd&ordermarket_cap_desc&per_page250&page1&sparklinetrue&price_change_percentage24…

手动抄表和自动抄表优缺点对比

随着科技的发展&#xff0c;自动抄表技术已经越来越成熟&#xff0c;被广泛应用于各个领域。然而&#xff0c;手动抄表在一些特定场景下仍然具有一定的优势。本文将从手动抄表和自动抄表的优缺点入手&#xff0c;对比分析它们的应用场景和使用价值。 1.成本低&#xff1a;手动抄…

Android Studio: unrecognized Attribute name MODULE

错误完整代码&#xff1a; &#xfffd;&#xfffd;&#xfffd;&#xfffd;&#xfffd;&#xfffd; (1.8.0_291) &#xfffd;г&#xfffd;&#xfffd;&#xfffd;&#xfffd;쳣&#xfffd;&#xfffd;&#xfffd;&#xfffd;&#xfffd;&#xfffd;&#xff…

web安全漏洞

1.什么是Web漏洞   WEB漏洞通常是指网站程序上的漏洞&#xff0c;可能是由于代码编写者在编写代码时考虑不周全等原因而造成的漏洞。如果网站存在WEB漏洞并被黑客攻击者利用&#xff0c;攻击者可以轻易控制整个网站&#xff0c;并可进一步提前获取网站服务器权限&#xff0c;…

Linux Centos7 下使用yum安装的nginx平滑升级

1. 查看当前nginx版本 1nginx -v2. 查看centos版本 1cat /etc/redhat-release3. 创建一个新的文件nginx.repo&#xff0c;其中第三行的7是因为我的centos版本是7点多的&#xff0c;你看自己是多少就改多少 1vim /etc/yum.repos.d/nginx.repo23[nginx]4namenginx repo 5baseu…

[ACTF2020 新生赛]Exec1

拿到题目&#xff0c;不知道是sql注入还是命令执行漏洞 先ping一下主机 有回显&#xff0c;说明是命令执行漏洞 我们尝试去查看目录 127.0.0.1|ls&#xff0c;发现有回显&#xff0c;目录下面有个index.php的文件 我们之间访问index.php 输入127.0.0.1;cat index.php 发现又…

广州华锐互动:VR互动教学平台如何赋能职业院校?

随着科技的发展&#xff0c;我们的教育方式也在不断进步。其中&#xff0c;虚拟现实&#xff08;VR&#xff09;技术的出现为我们提供了一种全新的教学方式。特别是在职业学校中&#xff0c;VR互动教学平台已经成为一种重要的教学工具。 VR互动教学平台是一种利用虚拟现实技术创…

go mod 使用三方包、go get命令

一、环境变量设置 go env -w GO111MODULEon go env -w GOPROXYhttps://goproxy.cn,https://goproxy.io,direct 二、goland开启 go mod 三、go mod 使用 在go.mod文件中声明三方包地址&版本号即可&#xff0c;如下&#xff1a; 开发工具goland会自动解析go.mod文件&#x…

Linux 查看CPU架构及内核版本

涉及arch命令和/proc/version文件 1 查看CPU架构 有些软件的安装需要和CPU架构相匹配&#xff0c;如JDK等等&#xff0c;所以需要确定主机的CPU架构类型。可使用命令arch查看Linux系统的CPU架构&#xff0c;如下&#xff1a; arch 12 查看内核版本 文件/proc/version中包含系…

C/C++之自定义类型(结构体,位段,联合体,枚举)详解

个人主页&#xff1a;点我进入主页 专栏分类&#xff1a;C语言初阶 C语言程序设计————KTV C语言小游戏 C语言进阶 C语言刷题 欢迎大家点赞&#xff0c;评论&#xff0c;收藏。 一起努力&#xff0c;一起奔赴大厂。 目录 个人主页&#xff1a;点我进入主页 …

React笔记:useState

1 介绍 useState 是 React 中一个非常重要的钩子&#xff08;Hook&#xff09;&#xff0c;允许在函数组件中添加状态。 2 基本用法 useState 是一个函数&#xff0c;它接收一个参数&#xff08;初始状态值&#xff09;并返回一个数组。 返回的这个数组包含两个元素&#xf…