ulthon/layui-ul
1
0
Fork 0
mirror of https://gitee.com/ulthon/layui-ul.git synced 2026-07-08 05:12:48 +08:00
Code Issues Packages Projects Releases Wiki Activity

修改卡片排列

Browse Source
This commit is contained in:
augushong
2021-04-22 00:33:57 +08:00
parent 7cf709a60a
commit 99737b3358
2 changed files with 26 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
demo/card.html
View File

@@ -1,18 +1,20 @@
<fieldset class="layui-elem-field layui-field-title"> <fieldset class="layui-elem-field layui-field-title">
<legend>卡片A</legend> <legend>卡片A</legend>
<div class="layui-field-box"> <div class="layui-field-box">
<div class="ul-padding-md" data-repeat="3"> <div class="ul-padding-md">
<div class="ul-card-a"> <div class="ul-common-flex-list">
<div class="ul-card-a-left"> <div class="ul-card-a" data-repeat="3">
<img width="100%" src="{$site_logo_src}" alt=""> <div class="ul-card-a-left">
</div> <img width="100%" src="{$site_logo_src}" alt="">
<div class="ul-card-a-right"> </div>
<div class="ul-card-a-main"> <div class="ul-card-a-right">
<div class="ul-card-a-title"> <div class="ul-card-a-main">
卡片标题 <div class="ul-card-a-title">
</div> 卡片标题
<div class="ul-card-a-desc"> </div>
这是卡片说明 <div class="ul-card-a-desc">
这是卡片说明
</div>
</div> </div>
</div> </div>
</div> </div>

17
public/cdn/layui-ul.css
View File

@@ -58,6 +58,16 @@
background-color: #fff; background-color: #fff;
} }
.ul-common-flex-list{
display: flex;
flex-wrap: wrap;
}
.ul-common-flex-sb {
display: flex;
align-items: center;
justify-content: space-between;
}
/* 通用类结束 */ /* 通用类结束 */
/* 用户头像开始 */ /* 用户头像开始 */
@@ -709,6 +719,8 @@
color: #516073; color: #516073;
padding: 15px; padding: 15px;
cursor: pointer; cursor: pointer;
margin-right: 15px;
margin-bottom: 15px;
} }
.ul-card-a-left { .ul-card-a-left {
width: 40%; width: 40%;
@@ -782,11 +794,6 @@
border-bottom: 1px dotted #d9d9d9; border-bottom: 1px dotted #d9d9d9;
} }
.ul-common-flex-sb {
display: flex;
align-items: center;
justify-content: space-between;
}
.ul-card-bank-body { .ul-card-bank-body {
height: 40px; height: 40px;
padding: 10px 10px 20px 0; padding: 10px 10px 20px 0;