141 lines
1.9 KiB
Plaintext
141 lines
1.9 KiB
Plaintext
.box{
|
|
width: 100%;
|
|
height: 700px;
|
|
background-color: antiquewhite;
|
|
}
|
|
|
|
/* 头 */
|
|
.box1{
|
|
width: 100%;
|
|
height: 50px;
|
|
position: absolute;
|
|
background-color: #eec2c7;
|
|
}
|
|
|
|
.box9{
|
|
width: 50px;
|
|
height: 50px;
|
|
position: absolute;
|
|
left: 10px;
|
|
}
|
|
.box9 image{
|
|
width: 30px;
|
|
height: 30px;
|
|
position: absolute;
|
|
top: 10px;
|
|
}
|
|
|
|
.box10{
|
|
width: 50px;
|
|
height: 50px;
|
|
position: absolute;
|
|
left: 150px;
|
|
}
|
|
.box10 image{
|
|
width: 30px;
|
|
height: 30px;
|
|
position: absolute;
|
|
top: 10px;
|
|
border-radius: 50px;
|
|
}
|
|
|
|
|
|
/* 客服名称 */
|
|
.p1{
|
|
font-size: 18px;
|
|
position: absolute;
|
|
left: 190px;
|
|
top: 15px;
|
|
}
|
|
|
|
/* 对话框 */
|
|
.box2{
|
|
width: 100%;
|
|
height: 700px;
|
|
position: absolute;
|
|
top: 50px;
|
|
background-color: #ffffff;
|
|
}
|
|
.box2 image{
|
|
width: 40px;
|
|
height: 40px;
|
|
position: absolute;
|
|
top: 28px;
|
|
left: 15px;
|
|
border-radius: 50px;
|
|
}
|
|
|
|
/* 客服消息 框 */
|
|
.box3{
|
|
width: 260px;
|
|
height: 40px;
|
|
position: absolute;
|
|
left: 60px;
|
|
top: 25px;
|
|
border: 1px #cfcfcf solid;
|
|
border-radius: 10px;
|
|
}
|
|
|
|
|
|
/* 客服消息 字 */
|
|
.p2{
|
|
font-size: 15px;
|
|
position: absolute;
|
|
top: 10px;
|
|
left: 10px;
|
|
}
|
|
|
|
/* 底部问话框 */
|
|
.box4{
|
|
width: 388px;
|
|
height: 40px;
|
|
position: fixed;
|
|
bottom: 20px;
|
|
border: 2px #cfcfcf solid;
|
|
border-radius: 15px;
|
|
}
|
|
|
|
/* 发送 框和字*/
|
|
.box5{
|
|
width: 60px;
|
|
height: 30px;
|
|
position: absolute;
|
|
top: 5px;
|
|
right: 20px;
|
|
background-color: #de868f;
|
|
border-radius: 10px;
|
|
}
|
|
.p3{
|
|
font-size: 16px;
|
|
position: absolute;
|
|
top: 6px;
|
|
left: 15px;
|
|
color: #ffffff;
|
|
}
|
|
|
|
/* 询问 */
|
|
.box6{
|
|
width: 220px;
|
|
height: 35px;
|
|
position: absolute;
|
|
left: 20px;
|
|
}
|
|
|
|
/* 预约 框和字*/
|
|
.box7{
|
|
width: 60px;
|
|
height: 30px;
|
|
position: absolute;
|
|
bottom: 75px;
|
|
right: 20px;
|
|
background-color: #58a55c;
|
|
border-radius: 10px;
|
|
}
|
|
.p4{
|
|
font-size: 16px;
|
|
font-weight: bold;
|
|
position: absolute;
|
|
top: 6px;
|
|
left: 15px;
|
|
color: #ffffff;
|
|
} |