elementUI中折叠面板箭头图标位置调整到最左边

news2024/11/15 21:34:37

跟flex布局有关

原始代码

<div id="app">
<el-collapse v-model="activeNames" @change="handleChange">
  <el-collapse-item title="一致性 Consistency" name="1">
    <div>与现实生活一致:与现实生活的流程、逻辑保持一致,遵循用户习惯的语言和概念;</div>
    <div>在界面中一致:所有的元素和结构需保持一致,比如:设计样式、图标和文本、元素的位置等。</div>
  </el-collapse-item>
</el-collapse>
</div>

原始效果

在这里插入图片描述

修改之后


第一部分


<div id="app">
<el-collapse v-model="activeNames" @change="handleChange">
  <el-collapse-item name="1">
    <span class="collapse-title" slot="title">一致性 Consistency</span>
    <div>与现实生活一致:与现实生活的流程、逻辑保持一致,遵循用户习惯的语言和概念;</div>
    <div>在界面中一致:所有的元素和结构需保持一致,比如:设计样式、图标和文本、元素的位置等。</div>
  </el-collapse-item>
</el-collapse>
</div>

第二部分


<style scoped>
.collapse-title {
  flex: 1 0 90%;
  order: 1;
}
</style>

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

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

相关文章

Centos8下编译安装最新版ffmpeg解决方案(含Centos8换源阿里云)

文章目录 1、下载FFmpeg源代码2、安装依赖3、配置编译选项&#xff08;关键&#xff09;linux依赖手动编译安装centos8换源阿里云 4、编译源代码5、安装FFmpeg6、验证安装 1、下载FFmpeg源代码 FFmpeg官网&#xff08;https://ffmpeg.org/download.html&#xff09;git clone …

python数据分析案例——天猫订单综合分析

前言 大家早好、午好、晚好吖 ❤ ~欢迎光临本文章 什么是数据分析 明确目的–获得数据(爬虫&#xff0c;现有&#xff0c;公开的数据)–数据预处理——数据可视化——结论 准备 环境使用&#xff1a; 在开始写我们的代码之前&#xff0c;我们要准备好运行代码的程序 Anacon…

Java Stream API的基本使用方法

前言 Java各个版本所更新的主要内容&#xff1a; 1.Java SE 8&#xff1a;引入了一些新特性&#xff0c;如lambda表达式、Stream API、格式化日期、国际化等。此外&#xff0c;还对并发编程进行了改进&#xff0c;引入了线程安全的Stream API。 2.Java SE 9&#xff1a;新增了…

李沐论文精度系列之十:GPT-4

文章目录 一、AIGC资讯速览1.1 Toolformer&#xff08;2023.2.9&#xff09;1.2 ChatGPT plugin1.3 LLaMA&#xff08;2023.2.24&#xff09;1.4 Visual ChatGPT&#xff08;2023.3.8&#xff09;1.5 GigaGAN&#xff08;2023.3.9&#xff09;1.6 Stanford Alpaca&#xff08;2…

面试官:详细说一下Java语言层面3种IO模型的实现

在Java中&#xff0c;一共有三种IO模型&#xff0c;分别是阻塞IO(BIO)、非阻塞IO(NIO)和异步IO(AIO)。 Linux五种IO模型和Java三种IO模型 Java BIO Java BIO就是Java的传统IO模型&#xff0c;对应了操作系统IO模型里的阻塞IO。 Java BIO相关的实现都位于java.io包下&#xf…

ECMA 各版本特性汇总

&#xff08;走运时,要想到倒霉&#xff0c;不要得意得过了头&#xff1b;倒霉时,要想到走运&#xff0c;不必垂头丧气。心态始终保持平衡&#xff0c;情绪始终保持稳定&#xff0c;此亦长寿之道。。——季羡林&#xff09; ECMA ecma官方网站 ecma github版本记录 w3schools …

由浅入深,聊聊OkHttp的那些事(易懂,不繁琐)

作者&#xff1a;Petterp 引言 在 Android 开发的世界中&#xff0c;有一些组件&#xff0c;无论应用层技术再怎么迭代&#xff0c;作为基础支持&#xff0c;它们依然在那里。 比如当我们提到网络库时&#xff0c;总会下意识想到一个名字&#xff0c;即 OkHttp 。 尽管对于大…

LVS和nginx和keepalived四层和7层的一些测试,nginx和keepalived共用环境的部署,lvs,nginx客户端IP透传

LVS和nginx的测试 实验DR模式 服务器IP备注mysql192.168.137.178测试服务器lvs**vip ** 192.168.137.99 RIP 192.168.137.100lvs服务器nginx1RIP 192.168.137.101nginx2RIP 192.168.137.102 LVS四层代理 test----lvs vip—nginx1/ngin2 LVS服务器的配置 [rootlvs openres…

Databend 开源周报第 92 期

Databend 是一款现代云数仓。专为弹性和高效设计&#xff0c;为您的大规模分析需求保驾护航。自由且开源。即刻体验云服务&#xff1a;https://app.databend.cn 。 Whats On In Databend 探索 Databend 本周新进展&#xff0c;遇到更贴近你心意的 Databend 。 在 WHERE 子句中…

算法记录 | Day56 动态规划

583.两个字符串的删除操作 思路&#xff1a; 1.确定dp数组&#xff08;dp table&#xff09;以及下标的含义&#xff1a;dp[i][j]&#xff1a;以i-1为结尾的字符串word1&#xff0c;和以j-1位结尾的字符串word2&#xff0c;想要达到相等&#xff0c;所需要删除元素的最少次数…

别去外包,干了3年,彻底废了......

先说一下自己的情况。大专生&#xff0c;19年通过校招进入湖南某软件公司&#xff0c;干了接近3年的测试&#xff0c;今年年上旬&#xff0c;感觉自己不能够在这样下去了&#xff0c;长时间呆在一个舒适的环境会让一个人堕落&#xff01;而我已经在一个企业干了三年&#xff0c…

存储迁移到vSAN后将oracle rac的共享虚拟磁盘由“精简置备”转换为“厚置备快速置零”格式

在vSAN 6.5.0环境中&#xff0c;将Oracle RAC虚拟机的存储迁移到vSAN数据存储后&#xff0c;共享磁盘在迁移后全部变成了“精简置备”类型&#xff0c;如下所示&#xff1a; 注&#xff1a;从vSAN 6.7 Patch 01开始&#xff0c;vSAN上的Oracle RAC 不再要求共享的 VMDKs为厚置…

【论文阅读】COPA:验证针对中毒攻击的离线强化学习的稳健策略

COPA: Certifying Robust Policies for Offline Reinforcement Learning against Poisoning Attacks 作者&#xff1a;Fan Wu, Linyi Li, Chejian Xu 发表会议&#xff1a;2022ICRL 摘要 目前强化学习完成任务的水平已经和人类相接近&#xff0c;因此研究人员的目光开始转向…

Springboot Security 认证鉴权——使用JSON格式参数登录

在 Spring Security 中&#xff0c;默认的登陆方式是以表单形式进行提交参数的。可以参考前面的几篇文章&#xff0c;但是在前后端分离的项目&#xff0c;前后端都是以 JSON 形式交互的。一般不会使用表单形式提交参数。所以&#xff0c;在 Spring Security 中如果要使用 JSON …

Ansys Lumerical | 单行载流子光电探测器仿真方法

综述 在本例中&#xff0c;我们将研究混合硅基光电探测器的各项性能。单行载流子&#xff08;uni-traveling carrier&#xff0c;UTC&#xff09;光电探测器&#xff08;PD&#xff09;由InP/InGaAs制成&#xff0c;其通过渐变耦合的方式与硅波导相连。在本次仿真中&#xff0c…

04-Docker镜像

镜像 镜像是一种轻量级、可执行的独立软件包&#xff0c;它包含运行某个软件所需的所有内容&#xff0c;我们把应用程序和配置依赖打包好形成一个可交付的运行环境&#xff08;包括代码、运行时需要的库、环境变量和配置文件等&#xff09;&#xff0c;这个打包好的运行环境就是…

上海亚商投顾:沪指午后跳水跌超1% 两市超4000只个股下跌

上海亚商投顾前言&#xff1a;无惧大盘涨跌&#xff0c;解密龙虎榜资金&#xff0c;跟踪一线游资和机构资金动向&#xff0c;识别短期热点和强势个股。 市场情绪 沪指今日冲高回落&#xff0c;盘中一度站上3400点关口&#xff0c;午后跳水跌超1%&#xff0c;深成指、创业板指同…

本科生学数据分析转行,能学会吗?

当然可以&#xff0c;大专及以上都可以学习数据分析转行&#xff0c;本科学历学习更有优势。数据分析职业对于学历方面还是比较看重的&#xff0c;同样技能情况下&#xff0c;学历越高&#xff0c;入行薪资起点也会高个至少一两千&#xff1b;入行以后的升职加薪就看个人的能力…

vue3学习七 toRef 和 toRefs

toRef 和 ref 的作用差不多是一样的&#xff0c;都是可以把一个数据变成响应式的 我们一般使用toRef 或都 toRefs 是用来&#xff0c;简化 template 中的 数据的写法的&#xff0c; 使一个深层次的数据不用书写的时候那么麻烦。 如果不嫌麻烦的话&#xff0c; 这两个api 可以不…

尚硅谷-宋红康-JVM上中下篇完整笔记-JVM中篇

一.Class文件结构 1.概述 1.1 字节码文件的跨平台性 所有的JVM全部遵守Java虚拟机规范:Java SE Specifications&#xff0c;也就是说所有的JV环境都是一样的&#xff0c;这样一来字节码文件可以在各种JVM上运行。 1.2 Java的前端编译器 想要让一个Java程序正确地运行在JVM中&am…