jquery+css实现手机端聊天即时通讯ui效果代码

代码语言:html

所属分类:布局界面

代码描述:jquery+css实现手机端聊天即时通讯ui效果代码

代码标签: jquery css 手机端 聊天 即时 通讯 ui

下面为部分代码预览,完整代码请点击下载或在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" />

   
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery.1.11.min.js"></script>
   
<script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/flexible.js"></script>
   
       
<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(//repo.bfw.wiki/bfwrepo/image/60b95f5dd4bec.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.........完整代码请登录后点击上方下载按钮下载查看

网友评论0