| New file |
| | |
| | | <template> |
| | | <div class="router-view"> |
| | | <div class="service"> |
| | | <div class="wrap container"> |
| | | <img |
| | | src="@/assets/forexImages/online-banner-c5baa5d5.png" |
| | | alt="" |
| | | class="leftImg" |
| | | /> |
| | | <div class="right"> |
| | | <ul> |
| | | <li> |
| | | <span>{{ $t("message.home.service") }}</span |
| | | ><img src="@/assets/forexImages/online-1-d61bee88.png" alt="" /> |
| | | </li> |
| | | </ul> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <footerView></footerView> |
| | | </template> |
| | | <style scoped> |
| | | .router-view { |
| | | flex: 1; |
| | | background-color: #000; |
| | | } |
| | | .container { |
| | | display: flex; |
| | | justify-content: center; |
| | | } |
| | | .wrap { |
| | | min-width: 100%; |
| | | max-width: 100%; |
| | | box-sizing: border-box; |
| | | padding: 0 12px; |
| | | margin: 0 auto; |
| | | } |
| | | .container .leftImg { |
| | | width: 426px; |
| | | height: 426px; |
| | | margin-right: 20px; |
| | | } |
| | | |
| | | .container .right { |
| | | display: flex; |
| | | flex-direction: column; |
| | | align-items: flex-start; |
| | | justify-content: center; |
| | | } |
| | | .container .right ul { |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | justify-content: space-between; |
| | | } |
| | | .container .right ul li { |
| | | padding: 20px 40px; |
| | | margin-bottom: 20px; |
| | | display: flex; |
| | | align-items: center; |
| | | justify-content: space-around; |
| | | background: #212121; |
| | | border-radius: 5px; |
| | | cursor: pointer; |
| | | } |
| | | .container .right ul li span { |
| | | color: #fff; |
| | | margin-right: 30px; |
| | | } |
| | | |
| | | .container .right img { |
| | | width: 80px; |
| | | height: 68px; |
| | | } |
| | | </style> |