IDEA制作简易登录界面

您所在的位置:网站首页 登录页面代码怎么写的 IDEA制作简易登录界面

IDEA制作简易登录界面

2024-07-09 12:01| 来源: 网络整理| 查看: 265

用户登录界面

新建project ctrl+shift+alt+s弹出Project Structure 在web-WEB-INF下New Folder两个文件夹classes,lib 在这里插入图片描述设置输入输出path 在这里插入图片描述 选择1.jars or directories 2.library,Apply应用 在这里插入图片描述运行tomcat 在这里插入图片描述 在这里插入图片描述 在index.jsp的同级目录下新建login.jsp 、login.css 在这里插入图片描述 输入网址http://localhost:8080/testproject_war_exploded/login.jsp 成功 在这里插入图片描述

代码

login.jsp代码

Login Login 登录

login.css代码

html { width: 100%; height: 100%; overflow: hidden; font-style: normal; } body { width: 100%; height: 100%; font-family: 'Open Sans', sans-serif; margin: 0; background-color: #4A374A; } #login { position: absolute; top: 50%; left: 50%; margin: -150px 0 0 -150px; width: 300px; height: 300px; } #login h1 { color: #fff; text-shadow: 0 0 10px; letter-spacing: 1px; text-align: center; } h1 { font-size: 2em; margin: 0.67em 0; } input { width: 278px; height: 18px; margin-bottom: 10px; outline: none; padding: 10px; font-size: 13px; color: #fff; text-shadow: 1px 1px 1px; border-top: 1px solid #312E3D; border-left: 1px solid #312E3D; border-right: 1px solid #312E3D; border-bottom: 1px solid #56536A; border-radius: 4px; background-color: #2D2D3F; } .but { width: 300px; min-height: 20px; display: block; background-color: #4a77d4; border: 1px solid #3762bc; color: #fff; padding: 9px 14px; font-size: 15px; line-height: normal; border-radius: 5px; margin: 0; }


【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3