web聊天自动回复--css

最新推荐文章于 2023-02-19 23:49:00 发布

涵祎是Abby

最新推荐文章于 2023-02-19 23:49:00 发布

阅读量703

点赞数

分类专栏： HTML CSS

本文链接：https://blog.csdn.net/weixin_42344266/article/details/81009818

版权

本文展示了如何使用CSS设计一个web聊天界面，包括聊天框、消息显示区、用户信息和常见问题等元素的样式设定，如边框、背景色、字体大小和颜色等，以及鼠标悬停效果。

摘要由CSDN通过智能技术生成

.webtitleWrap{
	width: 1023px;
	margin: 5px auto;
	height: 42px;
	border: 1px solid #ccc;
	background: #fff;
}
.webtitleWrap .customer{
	line-height: 42px;
	text-align: center;
	font-size: 12px;
}
.chatBox{
	width: 1023px;
	margin: 0px auto;
}
.dialogBox,.dialogMessage{
	background: #fff;
}
.dialogBox{
	width: 712px;
	border: 1px solid #ccc;	
	padding: 10px;
}
.dialogBox .dialog{
	width: 712px;
	border: 1px solid #ccc;	
	max-height: 550px;
    overflow: auto;
}
.dialogMessage{
	width: 282px;
	border: 1px solid #ccc;
}
.dialogBox .download{
	text-align: center;
	font-size: 12px;
	margin: 10px 0;
}
.dialogBox .download a{
	color: #000000;
}

.dialogMessage .worknumber{
	width: 100%;
	height: 204px;
	border-bottom: 1px solid #ccc;
}
.worknumber .workerimg{
	width: 100px;
	margin: 0px auto;
	text-align: center;
	overflow: hidden;
}
.workerimg .img{
	width: 45px;
	height: 60px;
	border: 2px solid #F89C33;
	margin: 50px 0 10px 23px;
}
.workerimg .worker,.worke