CSS 登录表单出现奇怪的效果，如何解决？
[英]CSS strange effect on login form, how to solve it?
问题描述
刚开始玩 HTML 和 CSS，我尝试创建一个注册表单。
在将一些 css 应用到我的 html 之后，我单击输入框后出现了奇怪的行为，请参见附件中的 gif。 看起来我的表单在点击时改变了不透明度。
这里的代码
.body{ background-image: linear-gradient(to right top, #0b5ad0, #0794e7, #004093, #0069bf); height: 100vh; width: 100vw; }.center{ display: inline-block; background-color: #000; color: #fff; opacity: .5; height: 50%; width: 50%; position: relative; left: calc(50%/2); top: 25%; border-radius: 10px; text-align: center; }.title{ text-transform: uppercase; font-size: 2vh; }.cont{ display: inline-block; width: 75%; text-align: left; position: relative; top: 0; margin-top: 0.5vh; } label{ font-size: 1.5vh; } input{ width: 100%; height: 30px; border-radius: 0.5vh; margin-top: 5px; }
<.DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Sign Up</title> <link rel="stylesheet" href="signup:css"> </head> <body class="body"> <div class="center"> <h1 class="title">Sign Up New User</h1> <form class="submit_form"> <div class="cont"> <label for="Name">First name:</label><br> <input type="text" id="Name" name="fname"> </div> <div class="cont"> <label for="Surname">Surname:</label><br> <input type="text" id="Surname" name="fsurname"> </div> </form> </div> </body> </html>
1 个解决方案
解决方案1
1 已采纳 2022-11-18 04:43:02
在“.center”class 中，我删除了不透明度：0.5并添加了使用 RGB 颜色这样的背景颜色：rgb(0 0 0 / 50%)； 用于设置透明背景。
.body{ background-image: linear-gradient(to right top, #0b5ad0, #0794e7, #004093, #0069bf); height: 100vh; width: 100vw; }.center{ display: inline-block; background-color: rgb(0 0 0 / 50%); color: #fff; height: 50%; width: 50%; position: relative; left: calc(50%/2); top: 25%; border-radius: 10px; text-align: center; }.title{ text-transform: uppercase; font-size: 2vh; }.cont{ display: inline-block; width: 75%; text-align: left; position: relative; top: 0; margin-top: 0.5vh; } label{ font-size: 1.5vh; } input{ width: 100%; height: 30px; border-radius: 0.5vh; margin-top: 5px; }
<.DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Sign Up</title> <link rel="stylesheet" href="signup:css"> </head> <body class="body"> <div class="center"> <h1 class="title">Sign Up New User</h1> <form class="submit_form"> <div class="cont"> <label for="Name">First name:</label><br> <input type="text" id="Name" name="fname"> </div> <div class="cont"> <label for="Surname">Surname:</label><br> <input type="text" id="Surname" name="fsurname"> </div> </form> </div> </body> </html>
在codeigniter中我的AJAX登录表单总是选择else语句，即使满足条件。 怎么解决这些？
[英]My AJAX login form in codeigniter always chooses the else statement, even if the conditions are met. How to solve these?
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.