|
|
HTML/CSS生成的聊天对话效果（含代码）
<div class="chatter">
<div class="chatter_pre_signup">
<input type="text" name="chatter_name" placeholder="Your name" class="chatter_field chatter_name" />
<input type="text" name="chatter_email" placeholder="Your email address" class="chatter_field chatter_email" />
<input type="submit" name="chatter_create_user" value="Start Chatting" class="chatter_btn chatter_create_user" />
</div>
<div class="chatter_post_signup">
<div class="chatter_convo">
<span class="chatter_msg_item chatter_msg_item_admin">
<a href="" class="chatter_avatar"><img src="http://www.gbtags.com/gb/networks/avatars/1679dd15-8c8e-4c35-ae18-365c523562be.JPG" /></a>
<strong class="chatter_name">李元芳</strong>Hello!</span>
<span class="chatter_msg_item chatter_msg_item_user">
<a href="" class="chatter_avatar"><img src="http://www.gbtags.com/gb/networks/avatars/1679dd15-8c8e-4c35-ae18-365c523562be.JPG" /></a>
<strong class="chatter_name">李媛芳</strong>Oh hello. Who is this?</span>
<span class="chatter_msg_item chatter_msg_item_admin">
<a href="" class="chatter_avatar"><img src="http://www.gbtags.com/gb/networks/avatars/1679dd15-8c8e-4c35-ae18-365c523562be.JPG" /></a>
<strong class="chatter_name">李元芳</strong>My name is Luke. How can I help you today? :)</span>
<span class="chatter_msg_item chatter_msg_item_user">
<a href="" class="chatter_avatar"><img src="http://www.gbtags.com/gb/networks/avatars/1679dd15-8c8e-4c35-ae18-365c523562be.JPG" /></a>
<strong class="chatter_name">李媛芳</strong>Just saying hello!</span>
<span class="chatter_msg_item chatter_msg_item_admin">
<a href="" class="chatter_avatar"><img src="http://www.gbtags.com/gb/networks/avatars/1679dd15-8c8e-4c35-ae18-365c523562be.JPG" /></a>
<strong class="chatter_name">李元芳</strong>Oh alright, Hello then Jack, you pirate, you.</span>
<span class="chatter_msg_item chatter_msg_item_admin">
<a href="" class="chatter_avatar"><img src="http://www.gbtags.com/gb/networks/avatars/1679dd15-8c8e-4c35-ae18-365c523562be.JPG" /></a>
<strong class="chatter_name">李元芳</strong>Hello!</span>
<span class="chatter_msg_item chatter_msg_item_user">
<a href="" class="chatter_avatar"><img src="http://www.gbtags.com/gb/networks/avatars/1679dd15-8c8e-4c35-ae18-365c523562be.JPG" /></a>
<strong class="chatter_name">李媛芳</strong>Oh hello. Who is this?</span>
<span class="chatter_msg_item chatter_msg_item_admin">
<a href="" class="chatter_avatar"><img src="http://www.gbtags.com/gb/networks/avatars/1679dd15-8c8e-4c35-ae18-365c523562be.JPG" /></a>
<strong class="chatter_name">李元芳</strong>My name is Luke. How can I help you today? :)</span>
<span class="chatter_msg_item chatter_msg_item_user">
<a href="" class="chatter_avatar"><img src="http://www.gbtags.com/gb/networks/avatars/1679dd15-8c8e-4c35-ae18-365c523562be.JPG" /></a>
<strong class="chatter_name">李媛芳</strong>Just saying hello!</span>
<span class="chatter_msg_item chatter_msg_item_admin">
<a href="" class="chatter_avatar"><img src="http://www.gbtags.com/gb/networks/avatars/1679dd15-8c8e-4c35-ae18-365c523562be.JPG" /></a>
<strong class="chatter_name">李元芳</strong>Oh alright, Hello then Jack, you pirate, you.</span>
</div>
<textarea name="chatter_message" placeholder="输入文字或者心情..." class="chatter_field chatter_message"></textarea>
</div>
</div>
|
|
IP卡
狗仔卡
发表于 2015-12-18 13:13:53
提升卡
置顶卡
喧嚣卡
变色卡
千斤顶
显身卡