BJ_web_developers / webportal

Commit cf6ed1ece6956f3a8a7d7e1294a3f0fef9320e82

Authored by liuqimichale
1 parent d5252bf8

软件平台

Inline Side-by-side
Showing 8 changed files with 155 additions and 19 deletions
images/portfolio-soft-wrap-1-active.png 0 → 100755
View file @cf6ed1e

2.45 KB
images/portfolio-soft-wrap-1.png 0 → 100755
View file @cf6ed1e

2.95 KB
images/portfolio-soft-wrap-2-active.png 0 → 100755
View file @cf6ed1e

1.87 KB
images/portfolio-soft-wrap-2.png 0 → 100755
View file @cf6ed1e

2.24 KB
images/portfolio-soft-wrap-3-active.png 0 → 100755
View file @cf6ed1e

2.04 KB
images/portfolio-soft-wrap-3.png 0 → 100755
View file @cf6ed1e

2.43 KB
portfolio.html
  View file @cf6ed1e
... ... @@ -66,27 +66,79 @@
66 66 </div>
67 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 70 <div class="container">
72 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 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 142 <div class="row">
91 143  
92 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
  View file @cf6ed1e
... ... @@ -4,7 +4,7 @@
4 4 padding:0;
5 5 }
6 6 .section{
7   - padding:162px 0 19px 0;
  7 + padding:162px 0 0 0;
8 8 }
9 9 html,body {
10 10 height: 100%;
... ... @@ -118,6 +118,90 @@ a:hover{
118 118 color: #fff;
119 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 207 .slicknav_menu{
... ...