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

增加详情属性排列

Browse Source
This commit is contained in:
augushong
2023-01-19 14:59:17 +08:00
parent fd34bb5b80
commit a27354cca3
5 changed files with 48 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

1
source/components/_index.scss
View File

@@ -1,4 +1,5 @@
@import './card/ul-easy-image/index';
@import './descriptions/ul-descriptions-info/index';
@import './descriptions/ul-easy-item/index';
@import './header/ul-shop-header/index';
@import './list/ul-book-item/index';

5
source/components/descriptions/ul-descriptions-info/_index.env Normal file
View File

@@ -0,0 +1,5 @@
title=详情属性排列
padding=1
margin=0
gray=0
mobile=1

18
source/components/descriptions/ul-descriptions-info/_index.html Normal file
View File

@@ -0,0 +1,18 @@
<div class="ul-descriptions-info">
<div class="ul-descriptions-info__item">
<div class="ul-descriptions-info__item__name">柜台价</div>
<div class="ul-descriptions-info__item__value">16元</div>
</div>
<div class="ul-descriptions-info__item">
<div class="ul-descriptions-info__item__name">适用年龄</div>
<div class="ul-descriptions-info__item__value">1-12岁</div>
</div>
<div class="ul-descriptions-info__item">
<div class="ul-descriptions-info__item__name">生产年份</div>
<div class="ul-descriptions-info__item__value">2023年</div>
</div>
<div class="ul-descriptions-info__item">
<div class="ul-descriptions-info__item__name">尺寸</div>
<div class="ul-descriptions-info__item__value">宽23cm 高 18cm</div>
</div>
</div>

0
source/components/descriptions/ul-descriptions-info/_index.md Normal file
View File

24
source/components/descriptions/ul-descriptions-info/_index.scss Normal file
View File

@@ -0,0 +1,24 @@
.ul-descriptions-info {
display : flex;
align-items : flex-start;
justify-content: space-between;
flex-wrap : wrap;
flex-shrink : 1;
&__item {
width : 50%;
line-height : 2.5;
display : flex;
align-items : center;
justify-content: flex-start;
color : #333;
&__name {
&::after {
content: "：";
}
margin-right: 5px;
}
}
}