layer mobile手机端移动端弹出层弹出框多种效果代码
代码语言:html
所属分类:弹出层
代码描述:layer mobile手机端移动端弹出层弹出框多种效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>layer弹层组件移动版</title>
<meta name="description" content="">
<meta http-equiv="X-UA-Compatible" content="chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="format-detection" content="telephone=no">
<style>
html,body,h1,h2,h3,h4,h5,p,div,ul,ol,li,pre,code,button{margin:0; padding:0;}
html, body{overflow-x:hidden;}
img{border:0}
body{ font-family: 'seanfont', "microsoft yahei"; font-size: 14px; line-height:22px; color:#333;}
h1{font-size:30px;}
ol{margin-left:20px;}
code{ margin: 0 2px; padding: 0 5px; white-space: nowrap; border: 1px solid #eaeaea; background-color: #f8f8f8; border-radius: 3px; font-size:14px;}
pre{white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space: -o-pre-wrap; word-wrap: break-word;}
h2{font-size:20px; margin:15px 0 10px; font-weight:400;}
a{text-decoration: none; color:#0099cc}
html{background-color:#F3F3F3;}
.main{position:relative; max-width:640px; margin:0 auto; padding:0 10px; }
header{background-color:#0099CC; margin-bottom:20px; color:#fff;}
header .main{height:120px;}
.main p{padding-bottom:5px;}
.main strong{font-weight:400;}
header h1{position:absolute; top:30px; left:20px;}
header h1 code{position:relative; top:-15px; margin-left: 8px; background:none;}
header nav{ position:absolute; bottom:15px; right:0; padding:0 10px;}
header nav a{display:inline-block; vertical-align:top; margin:0 10px; height:30px; line-height:30px; border:1px solid #AAEAFF; border-radius:3px; padding:0 20px; color:#fff;}
header nav a:hover{border:1px solid #fff;}
.demo{margin:10px 0;}
.demo a, .b.........完整代码请登录后点击上方下载按钮下载查看
















网友评论0