ant-design-vue form实现表单登录页面效果代码
代码语言:html
所属分类:表单美化
代码描述:ant-design-vue form实现表单登录页面效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>BFW NEW PAGE</title> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/vue@2.6.1.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/antd.1.7.4.js"></script> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/moment.min.js"></script> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/antd.1.7.4.css"> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/jquery-3.2.1.min.js"></script> <style> * { padding: 0; margin: 0; } body { padding: 0; margin: 0; } #root { padding-top:300px; margin: 0 auto; width: 300px; } #cont { background: url(//repo.bfw.wiki/bfwrepo/image/607aa1b0d81d0.png) no-repeat; height: 100%; width: 100vw; background-size: cover; } </style> </head> <body> <div id="cont"> <div id="root"> <a-form-model ref="form" :model="formData" :rules="formRules" :label-col="labelCol" :wrapper-col="wrapperCol" style="opacity:1;" > <a-form-model-item label="" prop="username"> <a-input ref="username" v-model="formData.username" size="large" placeholder="账号" @pressEnter="usernameEnterListen" /> </a-form-model-item> <a-form-model-item label="" prop="password"> <a-input-password ref="password" v-model="formData.password" size="large" .........完整代码请登录后点击上方下载按钮下载查看
网友评论0