<!DOCTYPE html>
<html lang="en" >
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>HTML5电脑端微信聊天窗口界面</title>
<link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,600" rel="stylesheet">
<link rel="stylesheet" href="css/reset.min.css">
<link rel="stylesheet" href="css/style.css">
</head>
<body>
<div class="wrapper">
<div class="container">
<div class="left">
<div class="top">
<input type="text" placeholder="Search" />
<a href="javascript:;" class="search"></a>
</div>
<ul class="people">
<li class="person" data-chat="person1">
<img src="img/thomas.jpg" alt="" />
<span class="name">Thomas Bangalter</span>
<span class="time">2:09 PM</span>
<span class="preview">I was wondering...</span>
</li>
<li class="person" data-chat="person2">
<img src="img/dog.png" alt="" />
<span class="name">Dog Woofson</span>
<span class="time">1:44 PM</span>
<span class="preview">I've forgotten how it felt before</span>
</li>
<li class="person" data-chat="person3">
<img src="img/louis-ck.jpeg" alt="" />
<span class="name">Louis CK</span>
<span class="time">2:09 PM</span>
<span class="preview">But we’re probably gonna need a new carpet.</span>
</li>
<li class="person" data-chat="person4">
<img src="img/bo-jackson.jpg" alt="" />
<span class="name">Bo Jackson</span>
<span class="time">2:09 PM</span>
<span class="preview">It’s not that bad...</span>
</li>
<li class="person" data-chat="person5">
<img src="img/michael-jordan.jpg" alt="" />
<span class="name">Michael Jordan</span>
<span class="time">2:09 PM</span>
<span class="preview">Wasup for the third time like is
you blind bitch</span>
</li>
<li class="person" data-chat="person6">
<img src="img/drake.jpg" alt="" />
<span class="name">Drake</span>
<span class="time">2:09 PM</span>
<span class="preview">howdoyoudoaspace</span>
</li>
</ul>
</div>
<div class="right">
<div class="top"><span>To: <span class="name">Dog Woofson</span></span></div>
<div class="chat" data-chat="person1">
<div class="conversation-start">
<span>Today, 6:48 AM</span>
</div>
<div class="bubble you">
Hello,
</div>
<div class="bubble you">
it's me.
</div>
<div class="bubble you">
I was wondering...
</div>
</div>
<div class="chat" data-chat="person2">
<div class="conversation-start">
<span>Today, 5:38 PM</span>
</div>
<div class="bubble you">
Hello, can you hear me?
</div>
<div class="bubble you">
I'm in California dreaming
</div>
<div class="bubble me">
... about who we used to be.
</div>
<div class="bubble me">
Are you serious?
</div>
<div class="bubble you">
When we were younger and free...
</div>
<div class="bubble you">
I've forgotten how it felt before
</div>
</div>
<div class="chat" data-chat="person3">
<div class="conversation-start">
<span>Today, 3:38 AM</span>
</div>
<div class="bubble you">
Hey human!
</div>
<div class="bubble you">
Umm... Someone took a shit in the hallway.
</div>
<div class="bubble me">
... what.
</div>
<div class="bubble me">
Are you serious?
</div>
<div class="bubble you">
I mean...
</div>
<div class="bubble you">
It’s not that bad...
</div>
<div class="bubble you">
But we’re probably gonna need a new carpet.
</div>
</div>
<div class="chat" data-chat="person4">
<div class="conversation-start">
<span>Yesterday, 4:20 PM</span>
</div>
<div class="bubble me">
Hey human!
</div>
<div class="bubble me">
Umm... Someone took a shit in the hallway.
</div>
<div class="bubble you">
... what.
</div>
<div class="bubble you">
Are you serious?
</div>
<div class="bubble me">
I mean...
</div>
<div class="bubble me">
It’s not that bad...
</div>
</div>
<div class="chat" data-chat="person5">
<div class="conversation-start">
<span>Today, 6:28 AM</span>
</div>
<div class="bubble you">
Wasup
</div>
<div class="bubble you">
Wasup
</div>
<div class="bubble you">
Wasup for the third time like is <br />you blind bitch
</div>
</div>
<div class="chat" data-chat="person6">
<div class="conversation-start">
<span>Monday, 1:27 PM</span>
</div>
<div class="bubble you">
So, how's your new phone?
</div>
<div class="bubble you">
You finally have a smartphone :D
</div>
<div class="bubble me">
Drake?
</div>
<div class="bubble me">
Why aren't you answering?
</div>
<div class="bubble you">
howdoyoudoaspace
</div>
</div>
<div class="write">
<a href="javascript:;" class="write-link attach"></a>
<input type="text" />
<a href="javascript:;" class="write-link smiley"></a>
<a href="javascript:;" class="write-link send"></a>
</div>
</div>
</div>
</div>
<script src="js/index.js"></script>
</body>
</html>
HTML5电脑端微信聊天窗口界面.rar
需积分: 0 152 浏览量
更新于2024-06-23
收藏 332KB RAR 举报
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面.rar
HTML5电脑端微信聊天窗口界面
强迫领导写Bug
- 粉丝: 310
- 资源: 68
最新资源
- MATLAB(GUI)交通标志识别[语音播报,GUI界面,解析].zip
- MATLAB(GUI)交通标志系统(多种标志,语音播报,Bp神经网络).zip
- MATLAB(GUI)家居防火(火焰识别的创新应用,有火焰则发送信息给模拟用户终端).zip
- MATLAB(GUI)教室人数统计(GUI框架,定位和分割人脸,计数).zip
- MATLAB(GUI)交通道路标识识别[红蓝黄,Bp算法].zip
- MATLAB(GUI)金属表面缺陷分析(SVM算法).zip
- MATLAB(GUI)考勤系统(Cnn卷积神经网络,GUI框架).zip
- MATLAB(GUI)口罩识别[未戴预警,GUI界面框架].zip
- MATLAB(GUI)口罩检测(不同类型口罩,GUI界面).zip
- MATLAB(GUI)口罩识别[自动定位颜色,多人检测,未戴预警 ].zip
- MATLAB(GUI)垃圾分类系统(同时识别多类,边缘和颜色的方法,Bp神经网络方法).zip
- MATLAB(GUI)口罩识别检测[自动定位颜色,未戴口罩预警,语音播报].zip
- Screenshot_2025-01-08-14-14-20-093_com.tencent.mm.jpg
- MATLAB(GUI)垃圾识别(GUI界面,自动定位垃圾).zip
- MATLAB(GUI)疲劳专注度检测系统(GUI框架,图片可换).zip
- MATLAB(GUI)疲劳检测GUI设计(可更换图片 ).zip