Skip to content

3
3DWeb
Commit 6623fd71 authored by lixiaoyi's avatar lixiaoyi
Browse files
Options

左侧图1

parent 2a686dfc
Hide whitespace changes
Inline Side-by-side
Showing with 56 additions and 30 deletions
css/index.css
View file @ 6623fd71
......@@ -102,6 +102,41 @@ body {
.item_wrap {
height: calc(100% - 32px);
line-height: 32px;
display: flex;
}
.item_wrap_content{
margin-top: 20px;
flex: 1;
height: 170px;
text-align: center;
flex-wrap: wrap;
}
.item_wrap_content>div{
width: 96px;
height: 100%;
background: url(../imgs/numerical.png) no-repeat;
background-size: 100%;
overflow: hidden;
}
.item_wrap_content:nth-child(2)>div{
margin-top: 34px;
}
.val{
margin-top: 33px;
margin-bottom: 5px;
font-size: 19px;
font-family: PingFang SC;
font-weight: bold;
color: #FB9931;
line-height: 1;
}
.name{
font-size: 12px;
font-family: PingFang SC;
font-weight: 500;
color: #FFFEFE;
line-height: 1;
}
.item_img {
......
index.html
View file @ 6623fd71
......@@ -23,15 +23,33 @@
<img class="item_img" src="./imgs/title@2x.png" alt="">
<span class="item_title" >文本标题</span>
</div>
<div class="item_wrap" ></div>
<div class="item_wrap">
<div class="item_wrap_content">
<div>
<div class="val" id="pro_eff">0</div>
<div class="name">生产效率</div>
</div>
</div>
<div class="item_wrap_content">
<div>
<div class="val" id="per_eff">0</div>
<div class="name">合格率</div>
</div>
</div>
<div class="item_wrap_content">
<div>
<div class="val" id="act_eff">0</div>
<div class="name">稼动率</div>
</div>
</div>
</div>
</div>
<div class="item">
<div class="item_header" >
<img class="item_img" src="./imgs/title@2x.png" alt="">
<span class="item_title" >文本标题</span>
</div>
<div class="item_wrap" ></div>
<div class="item_wrap" id="act_torque"></div>
</div>
<div class="item">
......@@ -39,33 +57,6 @@
<img class="item_img" src="./imgs/title@2x.png" alt="">
<span class="item_title" >文本标题</span>
</div>
<div class="item_wrap" >
<div>
<div class="val" id="pro_eff">0</div>
<div class="name">生产效率</div>
</div>
<div>
<div class="val" id="per_eff">0</div>
<div class="name">合格率</div>
</div>
<div>
<div class="val" id="act_eff">0</div>
<div class="name">稼动率</div>
</div>
</div>
</div>
<div class="item">
<div class="item_header" >
<img src="" alt="">
<span>文本标题</span>
</div>
<div class="item_wrap" id="act_torque"></div>
</div>
<div class="item">
<div class="item_header">
<img src="" alt="">
<span>文本标题</span>
</div>
<div class="item_wrap" id="torque"></div>
</div>
</div>
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment