jquery实现手机端移动端聊天窗口效果代码
代码语言:html
所属分类:布局界面
代码描述:jquery实现手机端移动端聊天窗口效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> <style> h5 { margin:0 } img { max-width:100%; vertical-align:middle } input { outline:0 } body { max-width:720px; margin:0 auto; background:#f1f1f1; color:#333; font-size:.26rem } .header { border-bottom:1px solid #dfdfdf; padding:0 .2rem; height:1rem; line-height:1rem; background:#fff; position:fixed; width:100%; max-width:720px; box-sizing:border-box; z-index:100 } .back { position:absolute; top:0; left:.3rem; background:url(../images/left.png) no-repeat; width:.2rem; height:.4rem; margin-top:.34rem; background-size:.2rem .4rem } .header .tit { font-size:.32rem; vertical-align:middle; text-align:center; height:1rem; line-height:1rem; font-weight:400 } .header .right { position:absolute; right:.3rem; top:0; float:none; font-size:.3rem; line-height:1.2rem } #message { background-color:#f1f1f1; padding:1.2rem .3rem 1rem } .time { font-size:.24rem; color:#999; margin-bottom:.3rem; text-align:center } #footer { position:fixed; bottom:0; height:1rem; background-color:#fff; li.........完整代码请登录后点击上方下载按钮下载查看
网友评论0