web程序登陆界面

【实例简介】
一步一步实现web程序信息管理系统之一----登陆界面实现 web程序登陆界面。
【实例截图】
【核心代码】
登陆
├── css
│   ├── login.css
│   ├── normalize.css
│   └── style.css
├── images
│   └── login
│   ├── 1.png
│   ├── loginbg.png
│   ├── loginbox.png
│   ├── logininputbg.png
│   └── login_logo.png
├── js
│   └── admin.js
├── plugins
│   ├── awesome-bootstrap-checkbox-1.0.1
│   │   ├── awesome-bootstrap-checkbox.css
│   │   └── demo
│   │   ├── build.css
│   │   ├── build.scss
│   │   └── index.html
│   ├── bootstrap-3.3.7
│   │   ├── css
│   │   │   ├── bootstrap.css
│   │   │   ├── bootstrap.css.map
│   │   │   ├── bootstrap.min.css
│   │   │   ├── bootstrap.min.css.map
│   │   │   ├── bootstrap-theme.css
│   │   │   ├── bootstrap-theme.css.map
│   │   │   ├── bootstrap-theme.min.css
│   │   │   └── bootstrap-theme.min.css.map
│   │   ├── fonts
│   │   │   ├── glyphicons-halflings-regular.eot
│   │   │   ├── glyphicons-halflings-regular.svg
│   │   │   ├── glyphicons-halflings-regular.ttf
│   │   │   ├── glyphicons-halflings-regular.woff
│   │   │   └── glyphicons-halflings-regular.woff2
│   │   └── js
│   │   ├── bootstrap.js
│   │   ├── bootstrap.min.js
│   │   └── npm.js
│   ├── BootstrapMenu.min.js
│   ├── bootstrap-table-1.12.1
│   │   ├── bootstrap-table.min.css
│   │   ├── bootstrap-table.min.js
│   │   └── locale
│   │   ├── bootstrap-table-af-ZA.js
│   │   ├── bootstrap-table-af-ZA.min.js
│   │   ├── bootstrap-table-ar-SA.js
│   │   ├── bootstrap-table-ar-SA.min.js
│   │   ├── bootstrap-table-ca-ES.js
│   │   ├── bootstrap-table-ca-ES.min.js
│   │   ├── bootstrap-table-cs-CZ.js
│   │   ├── bootstrap-table-cs-CZ.min.js
│   │   ├── bootstrap-table-da-DK.js
│   │   ├── bootstrap-table-da-DK.min.js
│   │   ├── bootstrap-table-de-DE.js
│   │   ├── bootstrap-table-de-DE.min.js
│   │   ├── bootstrap-table-el-GR.js
│   │   ├── bootstrap-table-el-GR.min.js
│   │   ├── bootstrap-table-en-US.js
│   │   ├── bootstrap-table-en-US.min.js
│   │   ├── bootstrap-table-es-AR.js
│   │   ├── bootstrap-table-es-AR.min.js
│   │   ├── bootstrap-table-es-CL.js
│   │   ├── bootstrap-table-es-CL.min.js
│   │   ├── bootstrap-table-es-CR.js
│   │   ├── bootstrap-table-es-CR.min.js
│   │   ├── bootstrap-table-es-ES.js
│   │   ├── bootstrap-table-es-ES.min.js
│   │   ├── bootstrap-table-es-MX.js
│   │   ├── bootstrap-table-es-MX.min.js
│   │   ├── bootstrap-table-es-NI.js
│   │   ├── bootstrap-table-es-NI.min.js
│   │   ├── bootstrap-table-es-SP.js
│   │   ├── bootstrap-table-es-SP.min.js
│   │   ├── bootstrap-table-et-EE.js
│   │   ├── bootstrap-table-et-EE.min.js
│   │   ├── bootstrap-table-eu-EU.js
│   │   ├── bootstrap-table-eu-EU.min.js
│   │   ├── bootstrap-table-fa-IR.js
│   │   ├── bootstrap-table-fa-IR.min.js
│   │   ├── bootstrap-table-fr-BE.js
│   │   ├── bootstrap-table-fr-BE.min.js
│   │   ├── bootstrap-table-fr-FR.js
│   │   ├── bootstrap-table-fr-FR.min.js
│   │   ├── bootstrap-table-he-IL.js
│   │   ├── bootstrap-table-he-IL.min.js
│   │   ├── bootstrap-table-hr-HR.js
│   │   ├── bootstrap-table-hr-HR.min.js
│   │   ├── bootstrap-table-hu-HU.js
│   │   ├── bootstrap-table-hu-HU.min.js
│   │   ├── bootstrap-table-id-ID.js
│   │   ├── bootstrap-table-id-ID.min.js
│   │   ├── bootstrap-table-it-IT.js
│   │   ├── bootstrap-table-it-IT.min.js
│   │   ├── bootstrap-table-ja-JP.js
│   │   ├── bootstrap-table-ja-JP.min.js
│   │   ├── bootstrap-table-ka-GE.js
│   │   ├── bootstrap-table-ka-GE.min.js
│   │   ├── bootstrap-table-ko-KR.js
│   │   ├── bootstrap-table-ko-KR.min.js
│   │   ├── bootstrap-table-ms-MY.js
│   │   ├── bootstrap-table-ms-MY.min.js
│   │   ├── bootstrap-table-nb-NO.js
│   │   ├── bootstrap-table-nb-NO.min.js
│   │   ├── bootstrap-table-nl-NL.js
│   │   ├── bootstrap-table-nl-NL.min.js
│   │   ├── bootstrap-table-pl-PL.js
│   │   ├── bootstrap-table-pl-PL.min.js
│   │   ├── bootstrap-table-pt-BR.js
│   │   ├── bootstrap-table-pt-BR.min.js
│   │   ├── bootstrap-table-pt-PT.js
│   │   ├── bootstrap-table-pt-PT.min.js
│   │   ├── bootstrap-table-ro-RO.js
│   │   ├── bootstrap-table-ro-RO.min.js
│   │   ├── bootstrap-table-ru-RU.js
│   │   ├── bootstrap-table-ru-RU.min.js
│   │   ├── bootstrap-table-sk-SK.js
│   │   ├── bootstrap-table-sk-SK.min.js
│   │   ├── bootstrap-table-sv-SE.js
│   │   ├── bootstrap-table-sv-SE.min.js
│   │   ├── bootstrap-table-th-TH.js
│   │   ├── bootstrap-table-th-TH.min.js
│   │   ├── bootstrap-table-tr-TR.js
│   │   ├── bootstrap-table-tr-TR.min.js
│   │   ├── bootstrap-table-uk-UA.js
│   │   ├── bootstrap-table-uk-UA.min.js
│   │   ├── bootstrap-table-ur-PK.js
│   │   ├── bootstrap-table-ur-PK.min.js
│   │   ├── bootstrap-table-uz-Latn-UZ.js
│   │   ├── bootstrap-table-uz-Latn-UZ.min.js
│   │   ├── bootstrap-table-vi-VN.js
│   │   ├── bootstrap-table-vi-VN.min.js
│   │   ├── bootstrap-table-zh-CN.js
│   │   ├── bootstrap-table-zh-CN.min.js
│   │   ├── bootstrap-table-zh-TW.js
│   │   └── bootstrap-table-zh-TW.min.js
│   ├── checkbix-1.1.3
│   │   ├── css
│   │   │   ├── checkbix.css
│   │   │   └── checkbix.min.css
│   │   └── js
│   │   ├── checkbix.js
│   │   └── checkbix.min.js
│   ├── device.min.js
│   ├── fastclick-1.0.6
│   │   └── fastclick.js
│   ├── font-awesome-4.7.0
│   │   ├── css
│   │   │   ├── font-awesome.css
│   │   │   └── font-awesome.min.css
│   │   └── fonts
│   │   ├── FontAwesome.otf
│   │   ├── fontawesome-webfont.eot
│   │   ├── fontawesome-webfont.svg
│   │   ├── fontawesome-webfont.ttf
│   │   ├── fontawesome-webfont.woff
│   │   └── fontawesome-webfont.woff2
│   ├── fullPage.js-2.9.2
│   │   ├── jquery.fullpage.css
│   │   ├── jquery.fullpage.extensions.min.js
│   │   ├── jquery.fullpage.js
│   │   ├── jquery.fullpage.min.css
│   │   ├── jquery.fullpage.min.css.map
│   │   ├── jquery.fullpage.min.js
│   │   ├── jquery.fullpage.min.js.map
│   │   └── jquery.jdirk.min.js
│   ├── jquery-1.12.4
│   │   ├── jquery.js
│   │   ├── jquery.min.js
│   │   └── jquery.min.map
│   ├── jquery-confirm-master
│   │   ├── jquery-confirm.min.css
│   │   └── jquery-confirm.min.js
│   ├── jquery.cookie-1.4.1.min.js
│   ├── malihu-custom-scrollbar-plugin-3.1.5
│   │   ├── jquery.mCustomScrollbar.concat.min.js
│   │   ├── jquery.mCustomScrollbar.css
│   │   ├── jquery.mCustomScrollbar.js
│   │   ├── jquery.mCustomScrollbar.min.css
│   │   └── js
│   │   └── minified
│   │   ├── jquery-1.11.0.min.js
│   │   ├── jquery-1.9.1.min.js
│   │   ├── jquery-2.1.0.min.js
│   │   ├── jquery.mCustomScrollbar.min.js
│   │   ├── jquery.mCustomScrollbar.min.js.gz
│   │   ├── jquery.mousewheel-3.0.6.min.js
│   │   ├── jquery.mousewheel.min.js
│   │   └── jquery-ui-1.10.4.min.js
│   ├── material-design-iconic-font-2.2.0
│   │   ├── css
│   │   │   ├── material-design-iconic-font.css
│   │   │   └── material-design-iconic-font.min.css
│   │   └── fonts
│   │   ├── Material-Design-Iconic-Font.eot
│   │   ├── Material-Design-Iconic-Font.svg
│   │   ├── Material-Design-Iconic-Font.ttf
│   │   ├── Material-Design-Iconic-Font.woff
│   │   └── Material-Design-Iconic-Font.woff2
│   ├── My97DatePicker
│   │   ├── calendar.js
│   │   ├── lang
│   │   │   ├── en.js
│   │   │   ├── zh-cn.js
│   │   │   └── zh-tw.js
│   │   ├── skin
│   │   │   ├── datePicker.gif
│   │   │   ├── default
│   │   │   │   ├── datepicker.css
│   │   │   │   └── img.gif
│   │   │   ├── WdatePicker.css
│   │   │   └── whyGreen
│   │   │   ├── bg.jpg
│   │   │   ├── datepicker.css
│   │   │   └── img.gif
│   │   └── WdatePicker.js
│   ├── select2-4.0.3
│   │   ├── css
│   │   │   ├── select2.css
│   │   │   └── select2.min.css
│   │   ├── js
│   │   │   ├── i18n
│   │   │   │   ├── ar.js
│   │   │   │   ├── az.js
│   │   │   │   ├── bg.js
│   │   │   │   ├── ca.js
│   │   │   │   ├── cs.js
│   │   │   │   ├── da.js
│   │   │   │   ├── de.js
│   │   │   │   ├── el.js
│   │   │   │   ├── en.js
│   │   │   │   ├── es.js
│   │   │   │   ├── et.js
│   │   │   │   ├── eu.js
│   │   │   │   ├── fa.js
│   │   │   │   ├── fi.js
│   │   │   │   ├── fr.js
│   │   │   │   ├── gl.js
│   │   │   │   ├── he.js
│   │   │   │   ├── hi.js
│   │   │   │   ├── hr.js
│   │   │   │   ├── hu.js
│   │   │   │   ├── id.js
│   │   │   │   ├── is.js
│   │   │   │   ├── it.js
│   │   │   │   ├── ja.js
│   │   │   │   ├── km.js
│   │   │   │   ├── ko.js
│   │   │   │   ├── lt.js
│   │   │   │   ├── lv.js
│   │   │   │   ├── mk.js
│   │   │   │   ├── ms.js
│   │   │   │   ├── nb.js
│   │   │   │   ├── nl.js
│   │   │   │   ├── pl.js
│   │   │   │   ├── pt-BR.js
│   │   │   │   ├── pt.js
│   │   │   │   ├── ro.js
│   │   │   │   ├── ru.js
│   │   │   │   ├── sk.js
│   │   │   │   ├── sr-Cyrl.js
│   │   │   │   ├── sr.js
│   │   │   │   ├── sv.js
│   │   │   │   ├── th.js
│   │   │   │   ├── tr.js
│   │   │   │   ├── uk.js
│   │   │   │   ├── vi.js
│   │   │   │   ├── zh-CN.js
│   │   │   │   └── zh-TW.js
│   │   │   ├── select2.full.js
│   │   │   ├── select2.full.min.js
│   │   │   ├── select2.js
│   │   │   └── select2.min.js
│   │   └── theme
│   │   ├── select2-bootstrap.css
│   │   └── select2-bootstrap.min.css
│   ├── Waves-0.7.6
│   │   ├── waves.css
│   │   ├── waves.js
│   │   ├── waves.min.css
│   │   ├── waves.min.js
│   │   └── waves.min.js.map
│   ├── webuploader-0.1.5.zip
│   └── zTree_v3
│   ├── css
│   │   ├── awesomeStyle
│   │   │   ├── awesome.css
│   │   │   ├── awesome.less
│   │   │   ├── fa.less
│   │   │   └── img
│   │   │   └── loading.gif
│   │   ├── demo.css
│   │   ├── metroStyle
│   │   │   ├── img
│   │   │   │   ├── line_conn.png
│   │   │   │   ├── loading.gif
│   │   │   │   ├── metro.gif
│   │   │   │   └── metro.png
│   │   │   └── metroStyle.css
│   │   └── zTreeStyle
│   │   ├── img
│   │   │   ├── diy
│   │   │   │   ├── 1_close.png
│   │   │   │   ├── 1_open.png
│   │   │   │   ├── 2.png
│   │   │   │   ├── 3.png
│   │   │   │   ├── 4.png
│   │   │   │   ├── 5.png
│   │   │   │   ├── 6.png
│   │   │   │   ├── 7.png
│   │   │   │   ├── 8.png
│   │   │   │   └── 9.png
│   │   │   ├── line_conn.gif
│   │   │   ├── loading.gif
│   │   │   ├── zTreeStandard.gif
│   │   │   └── zTreeStandard.png
│   │   └── zTreeStyle.css
│   └── js
│   ├── jquery.ztree.all.js
│   ├── jquery.ztree.all.min.js
│   ├── jquery.ztree.core.js
│   ├── jquery.ztree.core.min.js
│   ├── jquery.ztree.excheck.js
│   ├── jquery.ztree.excheck.min.js
│   ├── jquery.ztree.exedit.js
│   ├── jquery.ztree.exedit.min.js
│   ├── jquery.ztree.exhide.js
│   └── jquery.ztree.exhide.min.js
└── views
└── login.html

51 directories, 280 files