1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071 |
- .wux-grid {
- position: relative;
- float: left;
- box-sizing: border-box
- }
- .wux-grid--bordered::before {
- content: " ";
- position: absolute;
- right: 0;
- top: 0;
- width: 1PX;
- bottom: 0;
- border-right: 1PX solid #d9d9d9;
- color: #d9d9d9;
- transform-origin: 100% 0;
- transform: scaleX(.5)
- }
- .wux-grid--bordered::after {
- content: " ";
- position: absolute;
- left: 0;
- bottom: 0;
- right: 0;
- height: 1PX;
- border-bottom: 1PX solid #d9d9d9;
- color: #d9d9d9;
- transform-origin: 0 100%;
- transform: scaleY(.5)
- }
- .wux-grid--hover {
- background-color: #ececec
- }
- .wux-grid__thumb {
- width: 56rpx;
- height: 56rpx;
- display: block;
- margin: 0 auto
- }
- .wux-grid__label {
- text-align: center;
- color: #000;
- font-size: 28rpx;
- margin-top: 10rpx;
- width: auto;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
- word-wrap: normal
- }
- .wux-grid__inner {
- height: 100%;
- width: 100%;
- text-align: center;
- padding: 40rpx 20rpx;
- box-sizing: border-box;
- display: flex;
- flex-direction: column;
- justify-content: center;
- align-items: center
- }
- .wux-grid--square .wux-grid__content {
- position: relative;
- display: block;
- content: ' ';
- padding-bottom: 100%
- }
- .wux-grid--square .wux-grid__inner {
- position: absolute;
- top: 50%;
- transform: translate3d(0,-50%,0)
- }
|