diff --git a/src/App.vue b/src/App.vue index e327764..4043e42 100644 --- a/src/App.vue +++ b/src/App.vue @@ -29,5 +29,7 @@ image{ /* 宽度等于父盒子的宽度, 才不会主动撑开 */ Width:100%; + /* 移除图片标签默认的3px 间隙 */ + vertical-align: middle; } diff --git a/src/pages/index/index.vue b/src/pages/index/index.vue index 52a75a7..f96412c 100644 --- a/src/pages/index/index.vue +++ b/src/pages/index/index.vue @@ -25,16 +25,15 @@ - + - + - @@ -111,4 +110,39 @@ } } +/* 楼层 */ +.floor { + .floor_group_list { + /* 清除浮动 */ + overflow: hidden; + .floor_item { + float: left; + image { + width: 250rpx; + /* + 232px x 386 px + 232/386 = 250 / ? + */ + height: 207.9741379310345rpx; + } + } + .floor_item:nth-child(1) { + image { + height: 415.948275862069rpx; + } + } + /* 后四张图片加左边框 */ + .floor_item:nth-last-child(-n + 4) { + image { + border-left: 4rpx solid #fff; + } + } + /* 后两张图片加上边框 */ + .floor_item:nth-last-child(-n + 2) { + image { + border-top: 4rpx solid #fff; + } + } + } +}