精华内容
下载资源
问答
  • 网页登陆界面代码
    2022-05-10 19:09:25

    调用python自带tkinter库

    import tkinter

    创建窗口

    ck = Tk()

    显示名称

    ck.title("xxx")

    显示窗口大小

    ck.geometry(300x200) (geometry代表几何学 称为图形)

    显示刷新

    ck = mainloop()

    显示文本列如 账号

    Label(text="dhui"),place(x=11, y=22)

    创建输入框

    sr = Entry()

    输入框位置

    sr.place(x=22, y=33)

    创建按钮

    Button(text="按钮",commad=判断内容),place(x=22, y=33) 创建按钮位置

    总个流程

    # *-* coding:utf8 *-*
    from tkinter import *
    win = Tk()
    win.title("登入")
    win.geometry('300x200')  # geometry(几何学 ;表形状)
    Label(text="账号").place(x=30, y=50)
    zh = Entry()
    zh.place(x=80, y=50)
    
    Label(text="密码").place(x=30, y=70)
    se = Entry()
    se.place(x=80, y=70)
    
    
    def der():
        user = zh.get()
        see = se.get()
        if user == "12333" and see == "12333":
            print("登入成功")
        else:
            print("登入失败")
            exit()
    
    
    def dd():
        exit()
    
    
    Button(text="登入", command=der).place(x=80, y=120)
    Button(text="退出", command=dd).place(y=120, x=180)
    win.mainloop()
    更多相关内容
  • 复制代码 代码如下: <?php $password = “1234”; // 这里是密码 $p = “”; if(isset($_COOKIE[“isview”]) and $_COOKIE[“isview”] == $password){ $isview = true; }else{ if(isset($_POST[“pwd”])){ if...
  • 网页登陆界面

    2012-11-15 16:30:50
    网页蓝色登陆界面,html编写,下载后直接可用。
  • HTML5+CSS3 精美登陆界面源码

    千次下载 热门讨论 2016-01-19 09:52:44
    3个很精美的登陆界面,全都是用HTML5+CSS3开发的,所以可能不适合低版本IE浏览器。大家可以下来看看,做的超级漂亮的。
  • 网页页面设计<title>Bootstrap响应式登录界面模板</title> <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" /> <style type="text/css">
  • 一个基于vue的网页登录界面的demo。有背景图,有完整程序,可以实现。同时,登录界面可跳转,登录按钮按下后可跳转到另一个界面
  • 登录界面、找回密码界面、修改密码界面的源代码。 在制作过程中,有使用CSS、JS、Jquery。其中还有cookie、base64的js插件。 每一次刷新登录页面都可以自动刷新验证码。 提供的源代码仅供参考,如有不足,请多多指教...
  • 编写简单的登陆页面

    千次阅读 2022-01-02 16:05:44
    1.简单登录界面(自己设置css样式) 一个账号,玩转商城所有服务! 购机械,购二手装备,购配件,购模型,服务保修 *您的账号密码不匹配,请重新输入

    1.简单登录界面(自己设置css样式)

    代码如下

    <form id="loginForm" action="#" method="post" novalidate="novalidate">
            <div class="login_box">
                <div class="login_box_left">
                    <h1>一个账号,玩转商城所有服务!</h1>
                    <h2>购机械,购二手装备,购配件,购模型,服务保修</h2>
                    <div class="login_tip" style="display: none;">*您的账号密码不匹配,请重新输入</div>
                    <div class="login_name_box">
                        <div class="login_name_icon"></div>
                        <input type="text" id="username" name="username" class="loginname" maxlength="25" tabindex="1" placeholder="用户名/已验证的手机号码">
                    </div>
                    <div class="check_code_tip" id="usernameError" style="display: none;"></div>
                    <div class="login_code_box">
                        <div class="login_code_icon"></div>
                        <input type="password" id="password" name="password" class="logincode" maxlength="20" tabindex="2" autocomplete="off" placeholder="密码">
                    </div>
                    <div class="check_code_tip" id="passwordError" style="display: none;"></div>
                    <div class="forg_code_box">
                        <input type="checkbox" id="isRememberUsername" name="isRememberUsername" value="true" tabindex="4">
                        <span>&nbsp;&nbsp;&nbsp;记住用户名</span>
                        <a href="password_back.html">忘记密码</a>
                        <a href="register.html">免费注册</a>
                    </div>
                    <input type="button" class="login_btn" style="width:341px;cursor:pointer;" value="&nbsp;&nbsp;&nbsp;">
                </div>
                <div class="login_box_right">
                </div>
            </div>
        </form>
    

    在这里插入图片描述 2、编写js

    1. 给输入框设置鼠标移出时的验证,①验证用户名 ②验证密码
    2. 给登录按钮设置点击事件监听 ①首先判断用户名密码是否为空(不能为空) ②进入登录接口,利用Ajax与控制层建立连接,传入用户名和密码,并判断是否正确。
    3. 代码如下:
    define(['common'],function(common){
    	var isAccountValidate=false;
    	var isPasswordValidate=false;
    	//1.失去光标时验证用户名
    	function accountCheck(){
    		$("#username").blur(function(){
    			isAccountValidate= checkAccount();
    		});
    	}
    	//2.失去光标时验证密码
    	function pwdCheck(){
    		$("#password").blur(function(){
    			isPasswordValidate= checkPwd();
    		});
    	}
    	//登录
    	function loginBtn(){
    		//创建单击事件
    		$(".login_btn").click(function(){
    			//判断验证信息
    			//失败返回信息
    			if(!isAccountValidate){
    				return checkAccount();
    			}
    			if(!isPasswordValidate){
    				return checkPwd();
    			}
    			//成功进入接口登录
    			$.ajax({
    				url:baseUrl+"user/do_login.do",
    				type:"post",
    				data:{account:$("#username").val(),password:$("#password").val()},
    				xhrFields: {withCredentials: true},
    				crossDomain: true,
    				success:function(data){
    					//判断是否登陆成功
    					if(data.status==0){
    						//成功判断是否是管理员
    						if(data.data.role ==2){
    							$(window).attr("location","../admin/index.html");
    						}else{
    							$(window).attr("location","index.html");
    						}
    					}else{
    						$("#passwordError").css({display:"block"});
    						$("#passwordError").html(data.msg);
    					}
    				}
    			});
    		});
    	}
    
    
    
    	return {
    		accountCheck:accountCheck,
    		pwdCheck:pwdCheck,
    		loginBtn:loginBtn
    	};
    
    	//检查用户名
    	function checkAccount(){
    		//获取用户名
    		var account = $("#username").val();
    		$("#usernameError").css({display:"none"});
    		if(account == ""){
    			$("#usernameError").css({display:"block"});
    			$("#usernameError").html("用户名不能为空!");
    			return false;
    		}
    		return true;
    	}
    	//检查密码
    	function checkPwd(){
    		//获取输入密码
    		var pwd = $("#username").val();
    		$("#passwordError").css({display:"none"});
    		if(pwd == ""){
    			$("#passwordError").css({display:"block"});
    			$("#passwordError").html("密码不能为空!");
    			return false;
    		}
    		return true;
    	}
    
    });
    
    展开全文
  • 完整版VB登陆界面代码!复制到vb中即可使用。让初学者一看就懂,此代码直接连接数据库的,非常适合初学者和高级学者。
  • 这款登录界面有两个背景,可以在css中将背景设为images中的user_all_bg1.gif或者用户自己在css中改变。适合初学html、css借鉴。
  • 接下来,我们先上代码,看一下具体实现方法: login.html 登录页面 <link rel="stylesheet" type="text/css" href="login.css"/> <script type="text/javascript" src="login.js"></script>...

    登录界面html源代码_网页制作:一个简易美观的登录界面在这里插入图片描述

    效果图

    在我们做一个页面之前,要先想好他的一个整体布局,也就是我们这里面的login.html主页面,大致结构如下:

    在这里插入图片描述

    接下来,我们先上代码,看一下具体实现方法:

    login.html

    登录页面
    <link rel="stylesheet" type="text/css" href="login.css"/>
    <script type="text/javascript" src="login.js"></script>
    
    <p id="image_logo"><img src="images/login/fly.png"></p>
    
    <form method="post" action="login.js">
    
        <p><label class="label_input">用户名</label><input type="text" id="username" class="text_field"/></p>
        <p><label class="label_input">密码</label><input type="text" id="password" class="text_field"/></p>
    
        <div id="login_control">
            <input type="button" id="btn_login" value="登录" οnclick="login();"/>
            <a id="forget_pwd" href="forget_pwd.html">忘记密码?</a>
        </div>
    </form>
    
    说明: 在这个html里面,我们主要对登录界面进行了整体布局规划,利用div将内部的窗口、图片、标签、输入框、按钮、链接进行分块,这样方便我们之后用css对其进行准确的调位置、调边距。同时也对重要的几个东西设置了id和class,这也是方便我们之后用css对其进行准确的调颜色、调字体。 login.js

    /**

    • Created by Kay on 2016/3/8.
      */
      function login() {

      var username = document.getElementById(“username”);
      var pass = document.getElementById(“password”);

      if (username.value == “”) {

       alert("请输入用户名");
      

      } else if (pass.value == “”) {

       alert("请输入密码");
      

      } else if(username.value == “admin” && pass.value == “123456”){

       window.location.href="welcome.html";
      

      } else {

       alert("请输入正确的用户名和密码!")
      

      }
      }
      说明:
      这个js是用来判断用户名和密码是否正确的,实现起来还算简单。
      可以记一下,界面跳转的语句:
      window.location.href=“welcome.html”;
      其次就是对输入框的返回值的获取,这里我们用到了document.getElementById的知识点,通过document的对象方法来获得指定ID值的对象。这里要注意是byId,所以前面的html里的username和password要设id值,而不是name值,不然获取不到的!
      关于document的介绍可以点击该链接:详解JavaScript Document对象
      login.css

    body {
    background-image: url(“images/login/loginBac.jpg”);;
    background-size: 100%;
    background-repeat: no-repeat;
    }

    #login_frame {
    width: 400px;
    height: 260px;
    padding: 13px;

    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -200px;
    margin-top: -200px;
    
    background-color: rgba(240, 255, 255, 0.5);
    
    border-radius: 10px;
    text-align: center;
    

    }

    form p > * {
    display: inline-block;
    vertical-align: middle;
    }

    #image_logo {
    margin-top: 22px;
    }

    .label_input {
    font-size: 14px;
    font-family: 宋体;

    width: 65px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    
    color: white;
    background-color: #3CD8FF;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    

    }

    .text_field {
    width: 278px;
    height: 28px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    border: 0;
    }

    #btn_login {
    font-size: 14px;
    font-family: 宋体;

    width: 120px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    
    color: white;
    background-color: #3BD9FF;
    border-radius: 6px;
    border: 0;
    
    float: left;
    

    }

    #forget_pwd {
    font-size: 12px;
    color: white;
    text-decoration: none;
    position: relative;
    float: right;
    top: 5px;

    }

    #forget_pwd:hover {
    color: blue;
    text-decoration: underline;
    }

    #login_control {
    padding: 0 28px;
    }
    说明:
    这个css就是最难部分了,界面之所以能达到如此美观的效果,比如登录的窗口要在屏幕居中显示、背景透明、框的四个角要有一点弧度、登录按钮与输入框上下对齐等等。
    摘要:

    ①让背景图片拉伸且占据整个屏幕:
    background-size: 100%;
    background-repeat: no-repeat;

    ②让一个div块在整个屏幕居中:
    width: 400px;
    height: 260px;
    padding: 13px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -200px;
    margin-top: -200px
    (其中的margin-left:和margin-top最好是设为width和height的一半值,那样是完全居中的效果,当然记得前面要加个负号!)

    ③设置圆角:
    text-align: center;
    border-top-left-radius: 5px;
    border-bottom-left-radius: 5px;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;

    ④设置背景颜色且加透明效果:
    background-color: rgba(240, 255, 255, 0.5);

    ⑤让输入框和label对齐居中:
    form p > * {
    display: inline-block;
    vertical-align: middle;
    }
    ⑥去除链接的下划线:
    text-decoration: underline;

    7、给一个label或者button里面的文字设置居中:
    width: 120px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    (需要设置line-height 其值等于 height 也就是字的行高等于它所在的label、button的高!)

    8、给“登录”和“忘记密码”的中间设置间距:
    先在html里给他们绑定一块div:

    #login_control {
    padding: 0 28px;
    }
    原文链接:网页制作:一个简易美观的登录界面_javascript_Kuroko’s Development Notes-CSDN博客

    展开全文
  • Dreamweaver登陆界面怎么显示?Dreamweaver中想要显示登陆欢迎的界面,该怎么显示呢?下面我们就来看看详细的设置方法,需要的朋友可以参考下
  • 登录界面代码

    千次阅读 多人点赞 2021-06-09 16:36:43
    没有上传原背景图,使用的话需自己更改图片名称 可连接注册界面,和用户照片墙,此文只有登录界面代码,代码存在些许问题,望观看的大佬们多多指教! 登陆 登录 账号 密码 忘记密码? function jumpRe(){ window....

    拿走请三联,并注明出处!

    没有上传原背景图,使用的话需自己更改图片名称

    可连接注册界面,和用户照片墙,此文只有登录界面代码,代码存在些许问题,望观看的大佬们多多指教!

    <!DOCTYPE html>

     

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

        

        <title>登陆</title>

        <style>

            

            * {

                margin: 0;

                padding: 0;

            }

            

            html {

                height: 100%;

                width: 100%;

                overflow: hidden;

                margin: 0;

                padding: 0;

                background: url(w3.jpeg) no-repeat 0px 0px;

                background-repeat: no-repeat;

                background-size: 100% 100%;

                -moz-background-size: 100% 100%;

            }

            

            body {

                display: flex;

                align-items: center;

                justify-content: center;

                height: 100%;

            }

             #center {

               

                width:25%;

                display: flex;

                justify-content: center;

                align-items: center;

                height: 50%;

                background-color: rgba(250, 249, 246, 0.479);

                border-radius: 50%;

               

             }  

             

            p {

                margin-top: 30px;

                margin-left: 20px;

                color: rgb(51, 59, 59);

            }

             

            input {

                margin-left: 15px;

                border-radius: 5px;

                border-style: hidden;

                height: 30px;

                width: 140px;

               background-color: rgba(119, 173, 209, 0.5);

                outline: none;

                color: #ffffff;

                padding-left: 10px;

            }

             

            .button {

                border-color: cornsilk;

                background-color: rgba(100, 149, 237, .7);

                color: aliceblue;

                border-style: hidden;

                border-radius: 5px;

                width: 100px;

                height: 31px;

                font-size: 16px;

            }

            a{

                font-size: 17px;

                color:rgb(38, 135, 247);

            }

        </style>

    </head>

     

    <body>

        <div id="center">

            <form  action="">

                <h1 style="text-align: center;color:rgba(56, 55, 52, 0.788)">登录</h1><br>

                <hr><br>

                <p>账号<input type="text" placeholder="请输入邮箱" id="email"/></p>

     

                <p>密码<input type="password" placeholder="密码长度至少为六位" id="passworld"/></p>

                

                

     

                <div style="text-align: center;margin-top: 30px;">

                    <input type="submit" class="button"  value="登陆">

                    <input type="reset" class="button" οnclick="jumpRe()" value="注册"><br><br><br>

                    <a href="#" id="a" style=text-align:middle;>忘记密码?</a>

                    

                </div>

            </form>

        </div>

        <script language="javascript" type="text/javascript">

     

                function jumpRe(){

                 window.location.href="re.html";

                }

                document.getElementById("a").onclick = function click(){

          window.location.href="re.html";

        }

     

    //判断邮箱格式

            email.onchange = function(){

                var email = this.value;

                var reg = /^([a-zA-Z]|[0-9])(\w|\-)+@[a-zA-Z0-9]+\.([a-zA-Z]{2,4})$/;

                if(reg.test(email)){

                    alert("邮箱格式正确");

                }else{

                    alert("邮箱格式不正确");

                }

            }

     

    //判断密码格式

            passworld.onchange = function(){

                var passwolrd = this.value;

                var reg = /^(?![0-9]+$)(?![a-zA-Z]+$)[0-9A-Za-z]{6,12}$/;

                if(reg.test(passworld)){

                }else{

                    alert("密码格式不正确");

                }

            }

     

            function submit() {

                var pwd1 = document.getElementById("passworld").value;

                var e = document.getElementById("email").value;

                var pwd2=localStorage.getItem("password");

                var e2=localStorage.getItem("email");

                if(pwd1==pwd2&&e==e2)

                    window.location.href="照片墙.html";

                else

                    alert("账号或密码不正确");

            }

        </script>

    </body>

    </html>

     

    展开全文
  • 登陆页面模板

    2019-01-30 10:45:41
    内含一个登陆页面的html,和一个images的文件夹,页面简单适合学生下载使用。
  • html网页添加注册与登陆代码

    热门讨论 2012-08-02 14:57:44
    html网页添加注册与登陆代码实现登录注册的数据库连接和简单的登录注册设计
  • HTML实现界面登录

    2018-09-28 21:17:18
    利用HTML编写的网站登录界面界面友好,代码可见 下载即可使用
  • 一个简单的网页登陆界面,可以识别输入的密码邮箱等格式错误,原代码有很多的不必要代码,被我修改后更加简洁,也更适合新手。
  • 这篇文章就和大家分享一个HTML简单登录界面代码,有一定的参考价值,感兴趣的朋友可以看看。制作登录页面需要用到很多CSS属性和HTML标签,如有不清楚的同学可以看看我以前的文章,之前都有介绍过,或者访问CSS视频...
  • html网页设计简单登陆界面

    万次阅读 多人点赞 2017-11-05 13:12:53
    用户登录界面 *{ padding:0px; margin:0px; } a{color:White} body{ font-family:Arial, Helvetica, sans-serif; background:#000 no-repeat center; font-size:13px; } img{ border:0; } .lg{width:468px; height...
  • HTML+CSS实现登陆界面

    千次阅读 2022-01-14 16:34:09
    1、登录界面效果图:
  • 主要介绍了Java Web 登录页面的实现,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
  • 一个登录页面包含源码及注释,纯html代码
  • php注册登陆完整代码

    千次阅读 2021-02-08 22:35:27
    $dns = 'mysql:host=127.0.0.1;dbname=test';$username = 'root';$password = 'root';// 1.连接数据库,创建PDO对象$pdo = new PDO($dns,$...创建login.html,登陆页面。用户名密 码创建login.php,验证账号密码。...
  • JS实现登陆界面

    千次阅读 多人点赞 2020-11-19 19:33:29
    <input type="text" id="t4" value=""> 登陆"> form> <script> window.onload=function (){ var formObj=document.getElementById("myform"); formObj.onsubmit=checkAll; } function checkAll(){ if(userName...
  • Web网页登录页面设计

    2020-03-09 23:40:56
    利用web网页设计技术(html+css)进行静态登录页面设计开发,包含源代码 ,以及网页所用的图片
  • 网页制作:一个简易美观的登录界面

    万次阅读 多人点赞 2016-03-09 17:22:59
    这次来总结一下公司的Task 1 实现一个登录界面。 登录界面其实在大三的时候就有做过...然后我们看一下代码: 在我们做一个页面之前,要先想好他的一个整体布局,也就是我们这里面的login.html主页面,大致结构如...
  • python编辑用户登入界面的实现代码

    千次阅读 2020-12-30 07:38:13
    1.需求分析登入界面需要达到以下要求:系统要有登入和注册两个选项可供选择系统要能够实现登入出错提示,比如账户密码错误等,用户信息保存在user_info.txt文件夹中系统要能够进行登入错误次数统计并锁定,当用户...
  • 1小时学会不打代码制作一个网页精美简历(1)

    万次阅读 多人点赞 2021-05-13 22:39:48
    系列教程将会在流量降低时转为付费位置,流量多时将不会,各位抓紧时间学习哟~ 什么是低代码?什么是 IVX 小媛:bit 哥,我学了很多东西,例如 php、java、html之类,可是都做不了一个应用怎么办? 1_bit:你是指...
  • 登陆页面网页ui设计用户登录页面设计,
  • 可是这款程序毕竟是开源的,缺少定期的升级打补丁,之前版本的最大的问题就是很容易被挂马,挂黑链等等。...后台登陆不了,小编今天遇到一个客户就是使用这款开源程序搭建的一个企业站点可是再登陆...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 34,382
精华内容 13,752
关键字:

网页登陆界面代码