源码)"/>
万能的登录页面(含源码)
登录页面说好做也好做、说做好看也不太容易、做好看也比较浪费时间;做丑了、又看着难受。又想直接找一个现成的登录页面,好不容易找到了、又各种收费啥的。这是我之前遇到的情况。鉴于这种情况、我这里给出一个仿照的页面
视频演示
登录页面展示
页面效果
这个是简单的样式、可以进一步变体。可以在左侧空白部分设置一个轮播图、轮播播放图片。
1、部分页面样式代码
.footer-login {display: flex;justify-content: center;width: 80%;height: 46px;margin-top: 30px;margin-left: 10%;position: relative;background-color: #367bf0;
}.login_btn {width: 100%;height: 46px;letter-spacing: 10px;font-size: 20px;background: #367bf0;border: none;outline: none;color: white;cursor: pointer;
}.setting {text-align: center;/* margin: 5px 7%; */height: 38px;line-height: 35px;color: #d2d2d2;font-size: 14px;position: relative;
}a {color: #007bff;text-decoration: none;background-color: transparent;
}.el-select .el-input {width: 130px;
}
.input-with-select .el-input-group__prepend {background-color: #fff;
}
.el-input-group {width: 80%;
}
.el-input {margin-top: 20px;
}
2、源码(含图片)
在评论区
更多推荐
万能的登录页面(含源码)
发布评论