bootstrap自适应简洁登录表单页面效果代码

代码语言:html

所属分类:表单美化

代码描述:bootstrap自适应简洁登录表单页面效果代码

代码标签: bootstrap 登录 表单

下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

    <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
    <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/bootstrap.3.3.4.css">

    <style>
        @font-face {
      font-family: 'icomoon';
      src:  url('fonts/icomoon.eot?u4m6fy');
      src:  url('fonts/icomoon.eot?u4m6fy#iefix') format('embedded-opentype'),
        url('//repo.bfw.wiki/bfwrepo/images/login/3/icomoon.ttf') format('truetype'),
        url('fonts/icomoon.woff?u4m6fy') format('woff'),
        url('fonts/icomoon.svg?u4m6fy#icomoon') format('svg');
      font-weight: normal;
      font-style: normal;
    }
    
    [class^="icon-"], [class*=" icon-"] {
      /* use !important to prevent issues with browser extensions that change fonts */
      font-family: 'icomoon' !important;
      speak: none;
      font-style: normal;
      font-weight: normal;
      font-variant: normal;
      text-transform: none;
      line-height: 1;
    
      /* Better Font Rendering =========== */
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
    }
    
    .icon-logg:before {
      content: "\e915";
    }
    .icon-manager:before {
      content: "\e916";
    }
    .icon-user:before {
      content: "\e917";
    }
    .icon-data:before {
      content: "\e918";
    }
    .icon-sysmanager:before {
      content: "\e919";
    }
    .icon-list:before {
      content: "\e91a";
    }
    .icon-passagewaymanager:before {
      content: "\e91b";
    }
    .icon-base:before {
      content: "\e91c";
    }
    .icon-agentlist:before {
      content: "\e91d";
    }
    .icon-configure:before {
      content: "\e91e";
    }
    .icon-flow:before {
      content: "\e91f";
    }
    .icon-orderlist:before {
      content: "\e920";
    }
    .icon-ydlist:before {
      content: "\e921";
    }
    .icon-agentpay:before {
      content: "\e922";
    }
    .icon-agentsum:before {
      content: "\e923";
    }
    .icon-passagewaysum:before {
      content: "\e924";
    }
    .icon-custom:before {
      content: "\e925";
    }
    .icon-address:before {
      content: "\e926";
    }
    .icon-lock:before {
      content: "\e927";
    }
    
    
            body{color:#fff; font-family:"微软雅黑"; font-size:14px;}
            	.wrap1{position:absolute; top:0; right:0; bottom:0; left:0; margin:auto }/*把整个屏幕真正撑开--而且能自己实现居中*.........完整代码请登录后点击上方下载按钮下载查看

网友评论0