当前位置:首页 >> 网络编程

jQuery实现简易QQ聊天框

本文实例为大家分享了jQuery实现简易QQ聊天框的具体代码,供大家参考,具体内容如下

<!DOCTYPE html>
<html lang="en">
<head>
 <meta charset="UTF-8">
 <title>例子1</title>
<style type="text/css">
*{list-style: none;margin: 0;padding: 0;}
.box1{
 width: 500px;
 height: 480px;
 border: 1px solid #aaa;
 margin: 0 auto;
 margin-top: 20px;
}
.box{
 width: 500px;
 height: 250px;
 overflow: auto;
}
#bb{
 width: 494px;
 margin-top: -5px;
 border: 1px solid white;
 outline: none;
}
img{
 width: 500px;
}
.btn{
 margin-left:325px;
}
.btn,.btn1{
 background: #069dd5;
 width: 80px;
 padding: 3px 0;
 border-radius: 7px;
 color: white;
 font-size: 14px;
 outline: none;
}
.image{
 margin: 5px;
 width: 50px;
}
.pp{
 margin-left: 60px;
 margin-top: -50px;
 color: #009494;
 margin-bottom: 10px;
}
.ppp{
 width: 400px;
 margin-left: 60px;
 background: #eee;
 border-radius: 5px;
 padding: 5px; 
 font-size: 14px;
}
.item{
 margin-bottom: 20px;
}
</style>
</head>
<body>
<div class="box1">
 <div class="box">
 <ul class="items"></ul>
 </div>
 <img src="/UploadFiles/2021-04-02/asd.jpg">

jQuery实现简易QQ聊天框

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。