使用html、css、javascript写一个登录页面。
时间: 2023-02-21 12:26:14 浏览: 102
在写一个登录页面时,您可以使用 HTML、CSS 和 JavaScript 三种技术。
HTML 用于定义页面的内容结构,例如标题、文本、表单等。
CSS 用于定义页面的外观和布局,例如字体、颜色、间距等。
JavaScript 用于实现页面的动态效果,例如验证表单、提交数据等。
下面是一个简单的登录页面的示例代码:
```
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>登录页面</title>
<style>
/* 定义页面的样式 */
.container {
width: 500px;
margin: 0 auto;
text-align: center;
}
.form-group {
margin-top: 20px;
}
label {
display: block;
}
input[type="text"],
input[type="password"] {
width: 100%;
padding: 10px;
font-size: 16px;
margin-top: 10px;
}
input[type="submit"] {
width: 100%;
padding: 10px;
font-size: 16px;
margin-top: 10px;
background-color: #4CAF50;
color: white;
cursor: pointer;
}
</style>
</head>
<body>
<!-- 定义页面的内容 -->
<div class="container">
<h1>登录页面</h1>
<form>
<div class="form-group">
<label for="username">用户名:</label>
<input type="text" id="username" name="username">
</div>
<div class="form-group">
<label for="password">密码:</label>
<input type="password" id="password" name="password">
</div>
<input type="submit" value="登录">
</form>
</div>
</body>
</html>
```
希望这能对您有所帮助!
阅读全文