Files
rapidocr/ocrweb/static/css/main.css
T
2022-06-30 21:45:22 +08:00

97 lines
2.0 KiB
CSS

body{
background-color:#ebedef;
}
.btn-gen {
/* position: absolute;top:540px; left: 500px; */
background-color: #00a1d6;
text-align: center;
border-radius: 18px;
margin-top: 5px;
font-size: 15px;
padding: 5px 10px;
height: 20px;
width: 120px;
text-transform: uppercase;
color: #fff;
border:none;
}
.btn-gen:hover,
.btn-gen:focus {
border-color: #23AAEE;
background-color: #23AAEE;
color: white;
cursor: pointer;
}
.area{
text-align: center;
height: auto;
margin: auto;
}
.leftarea{
float: left;
width: 50%;
height: auto;
position: relative;
}
.rightarea{
float: left;
width: 50%;
height: auto;
}
.table{
width: auto;
height: auto;
margin: 0 auto;
}
.span_title{
width: 98%;
height: 36px;
margin-top: 4px;
line-height: 32px;
background-color: #00a1d6;
border: 1px solid #00a1d6;
border-radius: 20px;
color: #fff;
display: inline-block;
text-align: center;
font-size: 22px;
transition: .3s;
box-sizing: border-box;
}
.uplodNote{
font-size: 10px;
color:#A1A1A1;
}
a{
text-decoration:none;
}
/* wrapper */
.leftarea>#wrapper {
position: absolute; top: 45px; left:0px;
width: 98%;
height: 100%;
background:
linear-gradient(#1a98ca, #1a98ca),
linear-gradient(90deg, #ffffff33 1px,transparent 0,transparent 19px),
linear-gradient( #ffffff33 1px,transparent 0,transparent 19px),
linear-gradient(transparent, #1a98ca);
background-size:100% 1.5%, 10% 100%,100% 8%, 100% 100%;
background-repeat:no-repeat, repeat, repeat, no-repeat;
background-position: 0% 100%, 0 0, 0 0, 0 0;
/* 初始位置 */
clip-path: polygon(0% 0%, 100% 0%, 100% 1.5%, 0% 1.5%);
/* 添加动画效果 */
animation: move 1s infinite linear;
}
@keyframes move{
to{
background-position: 0 100%,0 0, 0 0, 0 0;
/* 终止位置 */
clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
}