diff --git a/app/assets/css/ebikes.css b/app/assets/css/ebikes.css index 85f9311..143a376 100644 --- a/app/assets/css/ebikes.css +++ b/app/assets/css/ebikes.css @@ -1,248 +1,277 @@ /*创特共享电动车*//*创特共享电动车*/ /*创特共享电动车*//*创特共享电动车*/ -.internet_Things_car .item1{ - height: 560px; - color: #22282A; - margin-top: 90px; - background: url('../img/ebike/banner.png') no-repeat center center #FF0; - background-size: auto 560px; - overflow: hidden; - padding-left: 15%; - line-height: 1; +.internet_Things_car .item1 { + height: 560px; + color: #22282A; + margin-top: 90px; + background: url('../img/img/ebike/banner.png') no-repeat center center #FF0; + background-size: auto 560px; + overflow: hidden; + padding-left: 15%; + line-height: 1; } -.internet_Things_car .item1 .head{ - font-size: 46px; - padding: 120px 0 70px 0; + +.internet_Things_car .item1 .head { + font-size: 46px; + padding: 120px 0 70px 0; } -.internet_Things_car .item1 .contents{ - font-size: 23px; + +.internet_Things_car .item1 .contents { + font-size: 23px; } -.internet_Things_car .item1 .contents .contents_1{ - margin-bottom: 24px; + +.internet_Things_car .item1 .contents .contents_1 { + margin-bottom: 24px; } -.internet_Things_car .item1 .contents .contents_2{ - width: 50%; - line-height: 1.5; + +.internet_Things_car .item1 .contents .contents_2 { + width: 50%; + line-height: 1.5; } -.internet_Things_car .item1 .mores{ - width: 160px; - height: 48px; - line-height: 48px; - font-size: 15px; - display: block; - margin-top: 70px; - text-align: center; - color: #22282A; - border: 1px solid #22282A; + +.internet_Things_car .item1 .mores { + width: 160px; + height: 48px; + line-height: 48px; + font-size: 15px; + display: block; + margin-top: 70px; + text-align: center; + color: #22282A; + border: 1px solid #22282A; } /*item2*//*item2*/ /*item2*//*item2*/ -.internet_Things_car .item2{ - padding: 80px 0 100px 0; - overflow: hidden; +.internet_Things_car .item2 { + padding: 80px 0 100px 0; + overflow: hidden; } -.internet_Things_car .item2 h2{ - color: #333; - margin: 0 0 100px 0; - padding: 0; - line-height: 1; - font-size: 34px; - overflow: hidden; + +.internet_Things_car .item2 h2 { + color: #333; + margin: 0 0 100px 0; + padding: 0; + line-height: 1; + font-size: 34px; + overflow: hidden; } -.internet_Things_car .item2 div{ - text-align: center; + +.internet_Things_car .item2 div { + text-align: center; } -.internet_Things_car .item2 div img{ - border: 1px solid #eee; - box-shadow: 0 4px 10px 0 rgba(0,0,0,0.06); + +.internet_Things_car .item2 div img { + border: 1px solid #eee; + box-shadow: 0 4px 10px 0 rgba(0, 0, 0, 0.06); } -.internet_Things_car .item2 div span{ - color: #333; - display: block; - font-size: 24px; - margin-top: 40px; + +.internet_Things_car .item2 div span { + color: #333; + display: block; + font-size: 24px; + margin-top: 40px; } /*item3*//*item3*/ /*item3*//*item3*/ -.internet_Things_car .item3{ - width: 100%; - height: 700px; - background: url('../img/internet_thinks/car_bg.png') no-repeat center center #F6F7F9; - background-size: auto 700; +.internet_Things_car .item3 { + width: 100%; + height: 700px; + background: url('../img/internet_thinks/car_bg.png') no-repeat center center #F6F7F9; + background-size: auto 700; } -.internet_Things_car .item3 h2{ - color: #333; - padding: 0; - font-size: 32px; - font-weight: 700; - margin: 160px 0 50px 0; + +.internet_Things_car .item3 h2 { + color: #333; + padding: 0; + font-size: 32px; + font-weight: 700; + margin: 160px 0 50px 0; } -.internet_Things_car .item3 p{ - padding: 0; - color: #666; - font-size: 18px; - line-height: 1.8; - margin: 0 0 40px 0; + +.internet_Things_car .item3 p { + padding: 0; + color: #666; + font-size: 18px; + line-height: 1.8; + margin: 0 0 40px 0; } -.internet_Things_car .item3 ul{ - margin: 0; - color: #999; - padding: 0 0 0 20px; + +.internet_Things_car .item3 ul { + margin: 0; + color: #999; + padding: 0 0 0 20px; } -.internet_Things_car .item3 ul li{ - padding: 0; - font-size: 16px; - margin: 0 0 24px 0; + +.internet_Things_car .item3 ul li { + padding: 0; + font-size: 16px; + margin: 0 0 24px 0; } /*item4*//*item4*/ /*item4*//*item4*/ -.internet_Things_car .item4{ - padding: 176px 0; +.internet_Things_car .item4 { + padding: 176px 0; } -.internet_Things_car .item4 h2{ - color: #333; - font-size: 32px; - padding: 0; - margin: 0 0 50px 0; + +.internet_Things_car .item4 h2 { + color: #333; + font-size: 32px; + padding: 0; + margin: 0 0 50px 0; } -.internet_Things_car .item4 p{ - margin: 0; - padding: 0; - color: #666; - font-size: 18px; - line-height: 1.5; + +.internet_Things_car .item4 p { + margin: 0; + padding: 0; + color: #666; + font-size: 18px; + line-height: 1.5; } /*item5*//*item5*/ /*item5*//*item5*/ -.internet_Things_car .item5{ - padding: 80px 0 100px 0; - overflow: hidden; +.internet_Things_car .item5 { + padding: 80px 0 100px 0; + overflow: hidden; } -.internet_Things_car .item5 h2{ - color: #333; - margin: 0 0 100px 0; - padding: 0; - line-height: 1; - font-size: 34px; - overflow: hidden; + +.internet_Things_car .item5 h2 { + color: #333; + margin: 0 0 100px 0; + padding: 0; + line-height: 1; + font-size: 34px; + overflow: hidden; } -.internet_Things_car .item5 .mini-group{ - height: 390px; - margin: 0 -5px; - border-radius: 4px; - line-height: 1; - box-shadow: 0 2px 17px 0 rgba(0,0,0,0.14); - overflow: hidden; + +.internet_Things_car .item5 .mini-group { + height: 390px; + margin: 0 -5px; + border-radius: 4px; + line-height: 1; + box-shadow: 0 2px 17px 0 rgba(0, 0, 0, 0.14); + overflow: hidden; } -.internet_Things_car .item5 .mini-group span{ - color: #333; - display: block; - font-size: 22px; - margin-top: 24px; - margin-left: 20px; - margin-bottom: 16px; + +.internet_Things_car .item5 .mini-group span { + color: #333; + display: block; + font-size: 22px; + margin-top: 24px; + margin-left: 20px; + margin-bottom: 16px; } -.internet_Things_car .item5 .mini-group p{ - padding: 0; - color: #999; - font-size: 16px; - line-height: 1.5; - margin: 0 20px; - overflow: hidden; + +.internet_Things_car .item5 .mini-group p { + padding: 0; + color: #999; + font-size: 16px; + line-height: 1.5; + margin: 0 20px; + overflow: hidden; } /*item6*//*item6*/ /*item6*//*item6*/ -.internet_Things_car .item6{ - padding: 80px 0 100px 0; - overflow: hidden; +.internet_Things_car .item6 { + padding: 80px 0 100px 0; + overflow: hidden; } -.internet_Things_car .item6 h2{ - color: #333; - margin: 0 0 100px 0; - padding: 0; - line-height: 1; - font-size: 34px; - overflow: hidden; + +.internet_Things_car .item6 h2 { + color: #333; + margin: 0 0 100px 0; + padding: 0; + line-height: 1; + font-size: 34px; + overflow: hidden; } -.internet_Things_car .item6 .mini-group{ - margin-bottom: 44px; - overflow: hidden; + +.internet_Things_car .item6 .mini-group { + margin-bottom: 44px; + overflow: hidden; } -.internet_Things_car .item6 .mini-group img{ - float: left; + +.internet_Things_car .item6 .mini-group img { + float: left; } -.internet_Things_car .item6 .mini-group p{ - float: left; - margin: 0 0 0 29px; - padding: 0; - overflow: hidden; - max-width: 52%; - line-height: 1; + +.internet_Things_car .item6 .mini-group p { + float: left; + margin: 0 0 0 29px; + padding: 0; + overflow: hidden; + max-width: 52%; + line-height: 1; } -.internet_Things_car .item6 .mini-group p span{ - display: block; + +.internet_Things_car .item6 .mini-group p span { + display: block; } -.internet_Things_car .item6 .mini-group p span:first-child{ - color: #333; - font-size: 22px; - margin-bottom: 6px; + +.internet_Things_car .item6 .mini-group p span:first-child { + color: #333; + font-size: 22px; + margin-bottom: 6px; } -.internet_Things_car .item6 .mini-group p span:last-child{ - color: #999; - font-size: 16px; - line-height: 1.5; + +.internet_Things_car .item6 .mini-group p span:last-child { + color: #999; + font-size: 16px; + line-height: 1.5; } /*item7*//*item7*/ /*item7*//*item7*/ -.internet_Things_car .item7{ - background: url('../img/ebike/item7-2.png') top center no-repeat #FFF; - background-size: 100% 500px; - padding: 80px 0 100px 0; - overflow: hidden; -} -.internet_Things_car .item7 h2{ - color: #fff; - font-size: 34px; -} -.internet_Things_car .item7 .sys-pice{ - margin: 40px 0 20px 0; - overflow: hidden; -} -.internet_Things_car .item7 .mini-group{ - height: 218px; - margin: 0 -10px; - padding: 0 10%; - overflow: hidden; -} -.internet_Things_car .item7 .mini-group img{ - margin-top: 30px; -} -.internet_Things_car .item7 .mini-group span{ - color: #333; - font-size: 22px; - margin-top: 20px; - display: block; -} -.internet_Things_car .item7 .mini-group p{ - color: #999; - font-size: 16px; - margin-top: 16px; +.internet_Things_car .item7 { + background: url('../img/ebike/item7-2.png') top center no-repeat #FFF; + background-size: 100% 500px; + padding: 80px 0 100px 0; + overflow: hidden; } +.internet_Things_car .item7 h2 { + color: #fff; + font-size: 34px; +} +.internet_Things_car .item7 .sys-pice { + margin: 40px 0 20px 0; + overflow: hidden; +} +.internet_Things_car .item7 .mini-group { + height: 218px; + margin: 0 -10px; + padding: 0 10%; + overflow: hidden; +} + +.internet_Things_car .item7 .mini-group img { + margin-top: 30px; +} + +.internet_Things_car .item7 .mini-group span { + color: #333; + font-size: 22px; + margin-top: 20px; + display: block; +} + +.internet_Things_car .item7 .mini-group p { + color: #999; + font-size: 16px; + margin-top: 16px; +} /*@media screen and (max-width: 990px) {} @@ -250,133 +279,155 @@ @media screen and (max-width: 768px) {} @media screen and (max-width: 600px) {} @media screen and (max-width: 500px) {}*/ -@media (max-width:770px){ - .navbar-default .navbar-brand img{ - margin: 12px 0 13px 0; - } - .navbar-default .navbar-brand span { - margin-top: 20px; - } +@media (max-width: 770px) { + .navbar-default .navbar-brand img { + margin: 12px 0 13px 0; + } + + .navbar-default .navbar-brand span { + margin-top: 20px; + } } + @media screen and (max-width: 414px) { - .internet_Things_car .item2, - .internet_Things_car .item5, - .internet_Things_car .item6, - .internet_Things_car .item7{ - padding: 20px 0 25px 0; - } - .internet_Things_car .item2 h2, - .internet_Things_car .item3 h2, - .internet_Things_car .item5 h2, - .internet_Things_car .item6 h2, - .internet_Things_car .item7 h2{ - margin: 0 0 25px 0; - font-size: 24px; - } + .internet_Things_car .item2, + .internet_Things_car .item5, + .internet_Things_car .item6, + .internet_Things_car .item7 { + padding: 20px 0 25px 0; + } + + .internet_Things_car .item2 h2, + .internet_Things_car .item3 h2, + .internet_Things_car .item5 h2, + .internet_Things_car .item6 h2, + .internet_Things_car .item7 h2 { + margin: 0 0 25px 0; + font-size: 24px; + } - .internet_Things_car .item1{ - height: 220px; - margin-top: 40px; - background-size: auto 100%; - background-position: 68% center; - padding-left: 2%; - /*box-sizing: border-box;*/ - } - .internet_Things_car .item1 .head{ - font-size: 22px; - padding: 15px 0 15px 0; - } - .internet_Things_car .item1 .contents{ - font-size: 14px; - } - .internet_Things_car .item1 .contents .contents_1{ - margin-bottom: 15px; - } - .internet_Things_car .item1 .contents .contents_2{ - width: 50%; - line-height: 1.5; - margin-top: 40px; - } - .internet_Things_car .item1 .mores{ - width: 88px; - height: 35px; - line-height: 35px; - font-size: 12px; - margin-top: 15px; - } - .navbar-default .navbar-brand{ - margin: 0; - } + .internet_Things_car .item1 { + height: 220px; + margin-top: 40px; + background-size: auto 100%; + background-position: 68% center; + padding-left: 2%; + /*box-sizing: border-box;*/ + } + + .internet_Things_car .item1 .head { + font-size: 22px; + padding: 15px 0 15px 0; + } + + .internet_Things_car .item1 .contents { + font-size: 14px; + } + + .internet_Things_car .item1 .contents .contents_1 { + margin-bottom: 15px; + } + + .internet_Things_car .item1 .contents .contents_2 { + width: 50%; + line-height: 1.5; + margin-top: 40px; + } + + .internet_Things_car .item1 .mores { + width: 88px; + height: 35px; + line-height: 35px; + font-size: 12px; + margin-top: 15px; + } + + .navbar-default .navbar-brand { + margin: 0; + } - .internet_Things_car .item2{ - padding: 20px 0 25px 0; - } - .internet_Things_car .item2 div span{ - font-size: 15px; - margin-top: 20px; - } - + .internet_Things_car .item2 { + padding: 20px 0 25px 0; + } - .internet_Things_car .item5 .mini-group{ - height: auto; - padding: 15px 0; - } - .internet_Things_car .item5 .mini-group span{ - font-size: 20px; - margin-top: 12px; - margin-left: 10px; - margin-bottom: 8px; - } - .internet_Things_car .item5 .mini-group p{ - font-size: 15px; - margin: 0 10px; - } - - - .internet_Things_car .item6 .mini-group{ - margin-top: 22px; - margin-bottom: 22px; - } - .internet_Things_car .item6 .mini-group p{ - margin: 0 0 0 15px; - max-width: 100%; - } - .internet_Things_car .item6 .mini-group p span:first-child{ - font-size: 15px; - margin-bottom: 6px; - } - .internet_Things_car .item6 .mini-group p span:last-child{ - font-size: 13px; - } + .internet_Things_car .item2 div span { + font-size: 15px; + margin-top: 20px; + } - .internet_Things_car .item7{ - background-size: 100% 170px; - padding: 20px 0 25px 0; - } - .internet_Things_car .item7 .sys-pice{ - margin: 20px 0 10px 0; - } - .internet_Things_car .item7 .mini-group{ - padding: 0 4%; - } - .internet_Things_car .item7 .mini-group img{ - margin-top: 15px; - } - .internet_Things_car .item7 .mini-group span{ - font-size: 14px; - margin-top: 10px; - } - .internet_Things_car .item7 .mini-group p{ - font-size: 13px; - margin-top: 10px; - } - .internet_Things_car .item8 h4 { - font-size: 16px; - margin: 11px 5px; - } + .internet_Things_car .item5 .mini-group { + height: auto; + padding: 15px 0; + } + + .internet_Things_car .item5 .mini-group span { + font-size: 20px; + margin-top: 12px; + margin-left: 10px; + margin-bottom: 8px; + } + + .internet_Things_car .item5 .mini-group p { + font-size: 15px; + margin: 0 10px; + } + + + .internet_Things_car .item6 .mini-group { + margin-top: 22px; + margin-bottom: 22px; + } + + .internet_Things_car .item6 .mini-group p { + margin: 0 0 0 15px; + max-width: 100%; + } + + .internet_Things_car .item6 .mini-group p span:first-child { + font-size: 15px; + margin-bottom: 6px; + } + + .internet_Things_car .item6 .mini-group p span:last-child { + font-size: 13px; + } + + + .internet_Things_car .item7 { + background-size: 100% 170px; + padding: 20px 0 25px 0; + } + + .internet_Things_car .item7 .sys-pice { + margin: 20px 0 10px 0; + } + + .internet_Things_car .item7 .mini-group { + padding: 0 4%; + } + + .internet_Things_car .item7 .mini-group img { + margin-top: 15px; + } + + .internet_Things_car .item7 .mini-group span { + font-size: 14px; + margin-top: 10px; + } + + .internet_Things_car .item7 .mini-group p { + font-size: 13px; + margin-top: 10px; + } + + .internet_Things_car .item8 h4 { + font-size: 16px; + margin: 11px 5px; + } } + /*@media screen and (max-width: 320px) { } \ No newline at end of file diff --git a/app/components/Navigation.vue b/app/components/Navigation.vue index b93bce2..b5ed6f5 100644 --- a/app/components/Navigation.vue +++ b/app/components/Navigation.vue @@ -15,7 +15,7 @@