<form action="/login" method="post"> <div class="login_box"> <input type="text" name="username" id="username" required> <label for="username">用户名</label> </div> <div class="login_box"> <input type="password" name="password" id="password" required> <label for="password">密码</label> </div> <button type="submit" id="login-btn">登录</button> </form> <a href="register.html"> 注册 <span></span> <span></span> <span></span> <span></span>优化代码,让form表单里的button和注册按钮样式一样
时间: 2023-08-14 14:58:00 浏览: 115
要使表单中的登录按钮样式与注册按钮样式相同,您可以使用与注册按钮相同的HTML结构和CSS样式。以下是经过优化的代码示例:
```html
<form action="/login" method="post">
<div class="login_box">
<input type="text" name="username" id="username" required>
<label for="username">用户名</label>
</div>
<div class="login_box">
<input type="password" name="password" id="password" required>
<label for="password">密码</label>
</div>
<a href="register.html" class="register-btn">
注册
<span></span>
<span></span>
<span></span>
<span></span>
</a>
<button type="submit" id="login-btn" class="register-btn">登录</button>
</form>
```
在CSS样式表中,您可以为`.register-btn`类添加与注册按钮相同的样式:
```css
.register-btn {
/* 添加与注册按钮相同的样式 */
}
```
通过将登录按钮的`<button>`元素添加到注册按钮的`<a>`元素之后,并为两者都添加相同的`.register-btn`类,可以使它们具有相同的样式。
请根据您的具体需求和样式要求,修改和添加适当的CSS样式来实现所需的效果。
阅读全文