|
|
@@ -31,50 +31,20 @@ |
|
|
|
.rotation3D__item .cont{ position: relative; z-index: 2; } |
|
|
|
.rotation3D__item .cont .iconfont { font-size: 28px; margin-top: 30px; margin-bottom: 96px; display: block; height: 35px;} |
|
|
|
.rotation3D__item .cont p{ color: #101010; } |
|
|
|
.itemList .rotation3D__item .cont p::after{ |
|
|
|
font-size: 12px; |
|
|
|
content: ''; |
|
|
|
position: absolute; |
|
|
|
left: 0; |
|
|
|
right: 0; |
|
|
|
margin-top: 60px; |
|
|
|
color: #101010; |
|
|
|
} |
|
|
|
/* |
|
|
|
.itemList .rotation3D__item:nth-child(1) .cont p::after{ |
|
|
|
content: "鹏城云脑一号"; |
|
|
|
} |
|
|
|
.itemList .rotation3D__item:nth-child(2) .cont p::after{ |
|
|
|
content: "鹏城云脑二号"; |
|
|
|
} |
|
|
|
.itemList .rotation3D__item:nth-child(3) .cont p::after{ |
|
|
|
content: "北大人工智能集群系统"; |
|
|
|
} |
|
|
|
.itemList .rotation3D__item:nth-child(4) .cont p::after{ |
|
|
|
content: "合肥类脑智能开放平台"; |
|
|
|
.lineList .rotation3D__line:nth-child(5n+0) .dot{ |
|
|
|
} |
|
|
|
.itemList .rotation3D__item:nth-child(5) .cont p::after{ |
|
|
|
content: "武汉人工智能计算中心"; |
|
|
|
.lineList .rotation3D__line:nth-child(5n+1) .dot{ |
|
|
|
animation-delay: 1s; |
|
|
|
} |
|
|
|
.itemList .rotation3D__item:nth-child(6) .cont p::after{ |
|
|
|
content: "西安未来人工智能计算中心"; |
|
|
|
.lineList .rotation3D__line:nth-child(5n+2) .dot{ |
|
|
|
animation-delay: 3s; |
|
|
|
} |
|
|
|
.itemList .rotation3D__item:nth-child(7) .cont p::after{ |
|
|
|
content: "更多接入中…"; |
|
|
|
.lineList .rotation3D__line:nth-child(5n+3) .dot{ |
|
|
|
animation-delay: 2s; |
|
|
|
} |
|
|
|
.itemList .rotation3D__item:nth-child(8) .cont p::after{ |
|
|
|
content: "中原人工智能计算中心"; |
|
|
|
.lineList .rotation3D__line:nth-child(5n+3) .dot{ |
|
|
|
animation-delay: 4s; |
|
|
|
} |
|
|
|
.itemList .rotation3D__item:nth-child(9) .cont p::after{ |
|
|
|
content: "成都人工智能计算中心"; |
|
|
|
} |
|
|
|
.itemList .rotation3D__item:nth-child(10) .cont p::after{ |
|
|
|
content: "横琴先进智能计算中心"; |
|
|
|
} |
|
|
|
.itemList .rotation3D__item:nth-child(11) .cont p::after{ |
|
|
|
content: "国家超级计算济南中心"; |
|
|
|
} |
|
|
|
*/ |
|
|
|
.rotation3D__item.blue{ color: #01e9fc; } |
|
|
|
.rotation3D__item.green{ color: #b4b3ca; } |
|
|
|
.rotation3D__item.yellow{ color: #ffd200; } |
|
|
@@ -91,14 +61,17 @@ |
|
|
|
---------------------------*/ |
|
|
|
.rotation3D__line{ |
|
|
|
position: absolute; left: 50%; top: 50%; |
|
|
|
display: block; width: 1px; height: 50%; |
|
|
|
display: block; |
|
|
|
width: 30px; |
|
|
|
height: 50%; |
|
|
|
padding-top: 60px; color: #fff; font-size: 50px; |
|
|
|
/*background: #fff;*/ |
|
|
|
/*原点设置在中间*/ |
|
|
|
transform-origin: 50% 0; |
|
|
|
transform-style: preserve-3d; |
|
|
|
} |
|
|
|
.rotation3D__line .pos{ position: absolute; top: 0; } |
|
|
|
overflow: hidden; |
|
|
|
} |
|
|
|
.rotation3D__line .pos{ position: absolute; top: 0; left: 15px;} |
|
|
|
.rotation3D__line svg { position: absolute; top: 0; } |
|
|
|
.rotation3D__line svg path { |
|
|
|
stroke: #fff; fill: none; |
|
|
@@ -140,9 +113,10 @@ |
|
|
|
position: absolute; |
|
|
|
font-size: 12px; |
|
|
|
color: #888; |
|
|
|
transform:scale(0.80); |
|
|
|
transform-origin:left; |
|
|
|
white-space: nowrap; |
|
|
|
transform: rotate(180deg)scale(0.80); |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
/*颜色*/ |
|
|
|
.rotation3D__line.blue { color: #07b2f9; } |
|
|
|