Commit cf6ed1ece6956f3a8a7d7e1294a3f0fef9320e82
1 parent
d5252bf8
软件平台
Showing
8 changed files
with
155 additions
and
19 deletions
images/portfolio-soft-wrap-1-active.png
0 → 100755
2.45 KB
images/portfolio-soft-wrap-1.png
0 → 100755
2.95 KB
images/portfolio-soft-wrap-2-active.png
0 → 100755
1.87 KB
images/portfolio-soft-wrap-2.png
0 → 100755
2.24 KB
images/portfolio-soft-wrap-3-active.png
0 → 100755
2.04 KB
images/portfolio-soft-wrap-3.png
0 → 100755
2.43 KB
portfolio.html
| @@ -66,27 +66,79 @@ | @@ -66,27 +66,79 @@ | ||
| 66 | </div> | 66 | </div> |
| 67 | <!--/ End breadcrumb --> | 67 | <!--/ End breadcrumb --> |
| 68 | 68 | ||
| 69 | - <!-- Latest Works Area --> | ||
| 70 | - <section id="portfolio-soft" class="section"> | 69 | + <section id="portfolio-soft-top" class="section"> |
| 71 | <div class="container"> | 70 | <div class="container"> |
| 72 | <div class="row"> | 71 | <div class="row"> |
| 73 | - <div class="col-md-12"> | ||
| 74 | - <div class="section-title"> | ||
| 75 | - <h2>硬件设备</h2> | ||
| 76 | - <ul> | ||
| 77 | - <li class="text-center"> | ||
| 78 | - 任你停 | ||
| 79 | - </li> | ||
| 80 | - <li class="text-center"> | ||
| 81 | - 企业云平台 | ||
| 82 | - </li> | ||
| 83 | - <li class="text-center"> | ||
| 84 | - 数据分析平台 | ||
| 85 | - </li> | ||
| 86 | - </ul> | ||
| 87 | - </div> | ||
| 88 | - </div> | 72 | + <div class="section-title-name">软件平台</div> |
| 73 | + <ul class="portfolio-soft-wrap"> | ||
| 74 | + <li class="text-center col-md-4 active"> | ||
| 75 | + 任你停 | ||
| 76 | + </li> | ||
| 77 | + <li class="text-center col-md-4"> | ||
| 78 | + 企业云平台 | ||
| 79 | + </li> | ||
| 80 | + <li class="text-center col-md-4"> | ||
| 81 | + 数据分析平台 | ||
| 82 | + </li> | ||
| 83 | + </ul> | ||
| 89 | </div> | 84 | </div> |
| 85 | + </div> | ||
| 86 | + </section> | ||
| 87 | + <ul class="portfolio-section-wrap"> | ||
| 88 | + <li class=""> | ||
| 89 | + <section> | ||
| 90 | + <div class="container"> | ||
| 91 | + <ul class="row ortfolio-soft-bottom-1"> | ||
| 92 | + <li class="text-center col-md-6"> | ||
| 93 | + 1 | ||
| 94 | + </li> | ||
| 95 | + <li class="text-center col-md-6"> | ||
| 96 | + 2 | ||
| 97 | + </li> | ||
| 98 | + | ||
| 99 | + </ul> | ||
| 100 | + </div> | ||
| 101 | + </section> | ||
| 102 | + </li> | ||
| 103 | + <li class="displaynone"> | ||
| 104 | + <section> | ||
| 105 | + <div class="container"> | ||
| 106 | + <ul class="row ortfolio-soft-bottom-2"> | ||
| 107 | + <li class="text-center col-md-6"> | ||
| 108 | + 1 | ||
| 109 | + </li> | ||
| 110 | + <li class="text-center col-md-6"> | ||
| 111 | + 2 | ||
| 112 | + </li> | ||
| 113 | + | ||
| 114 | + </ul> | ||
| 115 | + </div> | ||
| 116 | + </section> | ||
| 117 | + </li> | ||
| 118 | + <li class="displaynone"> | ||
| 119 | + <section> | ||
| 120 | + <div class="container"> | ||
| 121 | + <ul class="row ortfolio-soft-bottom-3"> | ||
| 122 | + <li class="text-center col-md-6"> | ||
| 123 | + 1 | ||
| 124 | + </li> | ||
| 125 | + <li class="text-center col-md-6"> | ||
| 126 | + 2 | ||
| 127 | + </li> | ||
| 128 | + | ||
| 129 | + </ul> | ||
| 130 | + </div> | ||
| 131 | + </section> | ||
| 132 | + </li> | ||
| 133 | + </ul> | ||
| 134 | + | ||
| 135 | + | ||
| 136 | + | ||
| 137 | + | ||
| 138 | + <!-- Latest Works Area --> | ||
| 139 | + <section id="" class="section"> | ||
| 140 | + <div class="container"> | ||
| 141 | + | ||
| 90 | <div class="row"> | 142 | <div class="row"> |
| 91 | 143 | ||
| 92 | <div class="col-md-6 col-sm-12 col-xs-12 wow fadeInLeft " data-wow-duration="0.8s" data-wow-delay="0.9s"> | 144 | <div class="col-md-6 col-sm-12 col-xs-12 wow fadeInLeft " data-wow-duration="0.8s" data-wow-delay="0.9s"> |
style.css
| @@ -4,7 +4,7 @@ | @@ -4,7 +4,7 @@ | ||
| 4 | padding:0; | 4 | padding:0; |
| 5 | } | 5 | } |
| 6 | .section{ | 6 | .section{ |
| 7 | - padding:162px 0 19px 0; | 7 | + padding:162px 0 0 0; |
| 8 | } | 8 | } |
| 9 | html,body { | 9 | html,body { |
| 10 | height: 100%; | 10 | height: 100%; |
| @@ -118,6 +118,90 @@ a:hover{ | @@ -118,6 +118,90 @@ a:hover{ | ||
| 118 | color: #fff; | 118 | color: #fff; |
| 119 | font-size: 71px; | 119 | font-size: 71px; |
| 120 | } | 120 | } |
| 121 | +#portfolio-soft-top{ | ||
| 122 | + background: #fff; | ||
| 123 | +} | ||
| 124 | +.section-title-name{ | ||
| 125 | + font-size: 36px; | ||
| 126 | + font-weight: 500; | ||
| 127 | + text-transform: uppercase; | ||
| 128 | + padding-bottom: 15px; | ||
| 129 | + margin-bottom: 15px; | ||
| 130 | + position: relative; | ||
| 131 | + text-align: center; | ||
| 132 | + margin-bottom: 40px; | ||
| 133 | +} | ||
| 134 | + | ||
| 135 | +.portfolio-soft-wrap li{ | ||
| 136 | + color:rgba(6,14,19,.8); | ||
| 137 | + font-size: 20px; | ||
| 138 | + cursor: pointer; | ||
| 139 | +} | ||
| 140 | +.portfolio-soft-wrap li:nth-of-type(1){ | ||
| 141 | + padding-top: 60px; | ||
| 142 | + background: url("images/portfolio-soft-wrap-1.png") no-repeat center 0; | ||
| 143 | + | ||
| 144 | +} | ||
| 145 | +.portfolio-soft-wrap li:nth-of-type(2){ | ||
| 146 | + padding-top: 60px; | ||
| 147 | + background: url("images/portfolio-soft-wrap-2.png") no-repeat center 0; | ||
| 148 | + | ||
| 149 | +} | ||
| 150 | +.portfolio-soft-wrap li:nth-of-type(3){ | ||
| 151 | + padding-top: 60px; | ||
| 152 | + background: url("images/portfolio-soft-wrap-3.png") no-repeat center 0; | ||
| 153 | + | ||
| 154 | +} | ||
| 155 | +.portfolio-soft-wrap li:nth-of-type(1).active{ | ||
| 156 | + color: #3F9FFE; | ||
| 157 | + padding-bottom: 10px; | ||
| 158 | + border-bottom: 3px solid rgba(63,159,254,1); | ||
| 159 | + background: url("images/portfolio-soft-wrap-1-active.png") no-repeat center 0; | ||
| 160 | +} | ||
| 161 | +.portfolio-soft-wrap li:nth-of-type(2).active{ | ||
| 162 | + color: #3F9FFE; | ||
| 163 | + padding-bottom: 10px; | ||
| 164 | + border-bottom: 3px solid rgba(63,159,254,1); | ||
| 165 | + background: url("images/portfolio-soft-wrap-2-active.png") no-repeat center 0; | ||
| 166 | +} | ||
| 167 | +.portfolio-soft-wrap li:nth-of-type(3).active{ | ||
| 168 | + color: #3F9FFE; | ||
| 169 | + padding-bottom: 10px; | ||
| 170 | + border-bottom: 3px solid rgba(63,159,254,1); | ||
| 171 | + background: url("images/portfolio-soft-wrap-3-active.png") no-repeat center 0; | ||
| 172 | +} | ||
| 173 | + | ||
| 174 | +.portfolio-section-wrap{ | ||
| 175 | + height: 596px; | ||
| 176 | + overflow: hidden; | ||
| 177 | +} | ||
| 178 | +.portfolio-section-wrap>li{ | ||
| 179 | + height: 596px; | ||
| 180 | +} | ||
| 181 | +.portfolio-section-wrap>li li{ | ||
| 182 | + height: 596px; | ||
| 183 | +} | ||
| 184 | +.displaynone{ | ||
| 185 | + display: none; | ||
| 186 | +} | ||
| 187 | +.ortfolio-soft-bottom-1 li:nth-of-type(1){ | ||
| 188 | + background: #ffff00; | ||
| 189 | +} | ||
| 190 | +.ortfolio-soft-bottom-1 li:nth-of-type(2){ | ||
| 191 | + | ||
| 192 | +} | ||
| 193 | +.ortfolio-soft-bottom-2 li:nth-of-type(1){ | ||
| 194 | + background: #f00; | ||
| 195 | +} | ||
| 196 | +.ortfolio-soft-bottom-2 li:nth-of-type(2){ | ||
| 197 | + | ||
| 198 | +} | ||
| 199 | +.ortfolio-soft-bottom-3 li:nth-of-type(1){ | ||
| 200 | + background: #f0f; | ||
| 201 | +} | ||
| 202 | +.ortfolio-soft-bottom-3 li:nth-of-type(2){ | ||
| 203 | + | ||
| 204 | +} | ||
| 121 | 205 | ||
| 122 | 206 | ||
| 123 | .slicknav_menu{ | 207 | .slicknav_menu{ |