123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185 |
- Page {
- width: 100%;
- /* height: 100%; */
- box-sizing: border-box;
- display: flex;
- flex-flow: column nowrap;
- justify-content: flex-start;
- align-items: center;
- background-color: #F7F7F7;
- }
- /* 头图的样式 */
- .top_img {
- width: 676rpx;
- height: 676rpx;
- margin-top: 28rpx;
- }
- .swiper{
- width: 676rpx;
- height: 704rpx;
- }
- /* banner的样式 */
- .banner_list {
- width: 676rpx;
- height: 148rpx;
- background: #FFFFFF;
- border-radius: 10rpx;
- margin-top: 30rpx;
- justify-content: space-around !important;
- }
- .banner_item {
- width: 100rpx;
- text-align: center;
- justify-content: space-between!important;
- align-items: center!important;
- }
- .b_i_img {
- width: 76rpx;
- height: 76rpx;
- margin-top: 12rpx;
- }
- .b_i_text {
- width: 160rpx;
- height: 24rpx;
- line-height: 24rpx;
- font-size: 24rpx;
- font-weight: 500;
- color: #303030;
- margin-bottom: 20rpx;
- margin-top: 8rpx;
- }
- /* 券包的样式 */
- .coupon_list {
- /* min-height: 360px; */
- width: 676rpx;
- background: #FFFFFF;
- border-radius: 10rpx;
- margin-top: 26rpx;
- box-sizing: border-box;
- padding: 40rpx 34rpx;
- margin-bottom: 40rpx;
- }
- .c_l_top{
- width: 100%;
- height: 36rpx;
- justify-content: space-between!important;
- }
- .c_l_top_l{
- width: 120rpx;
- line-height: 36rpx;
- font-size: 14px;
- font-weight: 700;
- color: #010101;
- text-align: left;
- }
- .c_l_top_r{
- width: 25px;
- line-height: 18px;
- font-size: 11px;
- font-weight: 400;
- color: #A0A0A0;
- text-align: right;
- }
- .coupon_item{
- height: 91px;
- margin-top: 18px;
- }
- .coupon_item_img{
- width: 112px;
- height: 91px;
- border-radius: 5px;
- }
- .coupon_item_right{
- width: 174px;
- height: 91px;
- margin-left: 17px;
- box-sizing: border-box;
- padding-top: 5px;
- justify-content: space-between!important;
- }
- .coupon_name{
- font-size: 14px;
- font-weight: 700;
- color: #010101;
- line-height:15px ;
- }
- .coupon_num{
- height: 11px;
- font-size: 11px;
- font-weight: 500;
- color: #A0A0A0;
- margin-top: 6px;
- }
- .coupon_i_r_bottom{
- justify-content: space-between!important;
- }
- .coupon_price{
- font-size: 11px;
- font-weight: 500;
- color: #B01717;
- }
- .coupon_buy{
- width: 80px;
- height: 29px;
- line-height: 29px;
- background: #B01717;
- border-radius: 14px;
- color: #ffffff;
- text-align: center;
- font-size: 15px;
- }
- /*用来包裹所有的小圆点 */
-
- .dots {
- width: 210rpx;
- height: 20rpx;
- display: flex;
- flex-flow: row nowrap;
- justify-content: center;
- position: absolute;
- left: 50%;
- transform: translateX(-50%);
- bottom: 0rpx;
- }
-
- .swiper_box {
- height: auto;
- position: relative;
- }
- /*未选中时的小圆点样式 */
-
- .dot {
- width: 40rpx;
- height: 10rpx;
- border-radius: 14rpx;
- margin-right: 20rpx;
- background-color: #ccc;
- opacity: 0.5;
- }
-
- /*选中以后的小圆点样式 */
-
- .active_dot {
- background-color: #333;
- opacity: 0.5;
- }
- .page{
- -webkit-filter: grayscale(100%);
- filter: grayscale(100%);
- }
|