Đăng nhập để hỏi chi tiết
Viết mã lệnh thiết lập web có mẫu như sau:
Hãy luôn nhớ cảm ơn và vote 5*
nếu câu trả lời hữu ích nhé!
TRẢ LỜI
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Đăng ký thành viên</title>
<style>
body{
font-family: Arial;
background-color: white;
}
h1{
text-align: center;
font-size: 50px;
margin-top: 10px;
margin-bottom: 20px;
outline-color: aqua;
}
.khung{
width: 900px;
margin: auto;
border: 3px solid black;
background: white;
padding: 20px;
}
table{
width: 100%;
}
td{
padding: 8px;
}
input[type=text],
input[type=password],
input[type=email],
textarea{
width: 95%;
padding: 5px;
}
.nut{
padding: 5px 15px;
font-weight: bold;
}
</style>
</head>
<body>
<h1>ĐĂNG KÝ THÀNH VIÊN</h1>
<div class="khung">
<form>
<table>
<tr>
<td>Họ Tên (*)</td>
<td>
<input type="text">
</td>
</tr>
<tr>
<td>Tên Đăng Nhập (*)</td>
<td>
<input type="text">
</td>
</tr>
<tr>
<td>Mật Khẩu (*)</td>
<td>
<input type="password">
</td>
</tr>
<tr>
<td>Xác nhận mật khẩu (*)</td>
<td>
<input type="password">
</td>
</tr>
<tr>
<td>Giới Tính</td>
<td>
<input type="radio" name="gt"> Nam
<input type="radio" name="gt"> Nữ
</td>
</tr>
<tr>
<td>Email</td>
<td>
<input type="email">
</td>
</tr>
<tr>
<td>Địa Chỉ</td>
<td>
<textarea rows="4"></textarea>
</td>
</tr>
<tr>
<td>Thông Tin Điều Khoản</td>
<td>
<input type="button" value="Đọc điều khoản">
<br><br>
<input type="checkbox">
Tôi chấp nhận điều khoản.
</td>
</tr>
<tr>
<td></td>
<td>
<input type="submit" value="Đăng Ký" class="nut">
<input type="reset" value="Hủy" class="nut">
</td>
</tr>
</table>
</form>
</div>
</body>
</html>Ở trên là có CSS, cho đẹp. Ở dưới là thuần html nhé
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Đăng ký thành vieen</title>
</head>
<body>
<h1 align="center">ĐĂNG KÝ THÀNH VIÊN</h1>
<table border="1" align="center" width="700">
<tr>
<td>Họ Tên (*)</td>
<td>
<input type="text" size="40">
</td>
</tr>
<tr>
<td>Tên Đăng Nhập (*)</td>
<td>
<input type="text" size="40">
</td>
</tr>
<tr>
<td>Mật Khẩu (*)</td>
<td>
<input type="password" size="40">
</td>
</tr>
<tr>
<td>Xác nhận mật khẩu (*)</td>
<td>
<input type="password" size="40">
</td>
</tr>
<tr>
<td>Giới Tính</td>
<td>
<input type="radio" name="gt"> Nam
<input type="radio" name="gt"> Nữ
</td>
</tr>
<tr>
<td>Email</td>
<td>
<input type="email" size="40">
</td>
</tr>
<tr>
<td>Địa Chỉ</td>
<td>
<textarea rows="4" cols="42"></textarea>
</td>
</tr>
<tr>
<td>Thông Tin Điều Khoản</td>
<td>
<input type="button" value="Đọc điều khoản">
<br><br>
<input type="checkbox">
Tôi chấp nhận điều khoản.
</td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="submit" value="Đăng Ký">
<input type="reset" value="Hủy">
</td>
</tr>
</table>
</body>
</html>Hãy giúp mọi người biết câu trả lời này thế nào?
55 vote
Gửi HTML + CSS
<!DOCTYPE html>
<html lang="vi">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Form Đăng Ký Thành Viên</title>
<style>
body {
font-family: Arial, sans-serif;
display: flex;
justify-content: center;
padding: 40px;
background-color: #f9f9f9;
}
.registration-container {
width: 600px;
}
.form-title {
text-align: center;
font-size: 42px;
font-weight: 900;
text-transform: uppercase;
color: #e0e0e0;
margin-bottom: 20px;
letter-spacing: 2px;
text-shadow:
-1px -1px 0 #000,
1px -1px 0 #000,
-1px 1px 0 #000,
1px 1px 0 #000,
2px 2px 0 #333,
4px 4px 0 #555;
}
.form-wrapper {
background: #fff;
padding: 30px 40px;
border: 4px solid #333;
outline: 1px solid #333;
outline-offset: -6px;
}
.registration-form {
display: flex;
flex-direction: column;
gap: 15px;
}
.form-group {
display: grid;
grid-template-columns: 200px 1fr;
align-items: center;
}
.form-group label {
font-size: 14px;
color: #000;
}
.form-group input[type="text"],
.form-group input[type="password"],
.form-group input[type="email"],
.form-group textarea {
padding: 6px;
border: 1px solid #999;
border-radius: 2px;
width: 100%;
box-sizing: border-box;
background-color: #fafafa;
}
.form-group textarea {
height: 60px;
resize: vertical;
}
.radio-group {
display: flex;
align-items: center;
gap: 5px;
}
.radio-group label {
margin-right: 15px;
}
.terms-group {
align-items: flex-start;
}
.terms-content {
display: flex;
flex-direction: column;
gap: 10px;
}
.btn-read-terms {
padding: 4px 10px;
border: 1px solid #666;
background-color: #eee;
cursor: pointer;
font-size: 12px;
width: max-content;
}
.checkbox-group {
display: flex;
align-items: center;
gap: 5px;
}
.form-actions {
display: flex;
justify-content: center;
gap: 20px;
margin-top: 20px;
}
.form-actions button {
padding: 6px 25px;
border: 1px solid #666;
background-color: #eee;
cursor: pointer;
font-weight: bold;
font-size: 14px;
}
.form-actions button:hover,
.btn-read-terms:hover {
background-color: #ddd;
}
</style>
</head>
<body>
<div class="registration-container">
<h1 class="form-title">Đăng Ký Thành Viên</h1>
<div class="form-wrapper">
<form class="registration-form">
<div class="form-group">
<label>Họ Tên (*)</label>
<input type="text" name="fullname">
</div>
<div class="form-group">
<label>Tên Đăng Nhập (*)</label>
<input type="text" name="username">
</div>
<div class="form-group">
<label>Mật Khẩu (*)</label>
<input type="password" name="password">
</div>
<div class="form-group">
<label>Xác nhận mật khẩu (*)</label>
<input type="password" name="confirm_password">
</div>
<div class="form-group">
<label>Giới Tính:</label>
<div class="radio-group">
<input type="radio" name="gender" value="male" checked>
<label for="male">Nam</label>
<input type="radio" name="gender" value="female">
<label for="female">Nữ</label>
</div>
</div>
<div class="form-group">
<label>Email:</label>
<input type="email" name="email">
</div>
<div class="form-group">
<label>Địa Chỉ</label>
<textarea name="address"></textarea>
</div>
<div class="form-group terms-group">
<label>Thông Tin Điều Khoản</label>
<div class="terms-content">
<button type="button" class="btn-read-terms">Đọc điều khoản</button>
<div class="checkbox-group">
<input type="checkbox" name="accept">
<label for="accept">Tôi chấp nhận điều khoản.</label>
</div>
</div>
</div>
<div class="form-actions">
<button type="submit" class="btn-submit">Đăng Ký</button>
<button type="reset" class="btn-cancel">Hủy</button>
</div>
</form>
</div>
</div>
</body>
</html>`--------------------`
Chúc bạn học tốt
```\color{#ff1100}{@}\color{#ff2212}{T}\color{#ff2e1f}{s}\color{#ff3c2e}{u}\color{#ff4f42}{n}\color{#ff5d52}{a}\color{#ff7066}{m}\color{#ff8178}{i}\color{#ff948c}{@}```
Hãy giúp mọi người biết câu trả lời này thế nào?
Bạn muốn hỏi điều gì?
Đặt câu hỏiPH/HS Tham Gia Nhóm Lớp 10 Để Trao Đổi Tài Liệu, Học Tập Miễn Phí!
ĐĂNG KÝ TÌNH NÊN
Ho Ten ()
Tên Đăng Nhập ()
Mat Khau ()
Xác nhận mật khẩu ()
Giới Tính:
Email:
Dia Chi
Thông Tin Điều Khoản
Nam Nu
Đọc điều khoản
L. Tôi chấp nhận điều khoản.
Đăng Ký
Huy
Bảng tin
Bạn muốn hỏi điều gì?
Đặt câu hỏi
Cơ quan chủ quản: Công ty Cổ phần Công nghệ Giáo dục Thành Phát
Tải ứng dụng
Inbox: m.me/hoidap247online
Trụ sở: Tầng 7, Tòa Intracom, số 82 Dịch Vọng Hậu, Cầu Giấy, Hà Nội.
Giấy phép thiết lập mạng xã hội trên mạng số 331/GP-BTTTT do Bộ Thông tin và Truyền thông.
253
484
198
này t viết đúng như c bảo, nếu muốn cho cái chữ đăng ký thành viên vào trong thì cho vào trong <div class="khung"> nhé
253
484
198
cái outline-color: aqua; là t viết thừa nhé, k cho vào cũng dc
0
174
0
không xuống dòng à
0
174
0
sửa lại cho tôi được không
253
484
198
xuống dòng gì á, c copy y nguyên vào vss hay Sublime text là dc mà, t cũng viết từ vss xong copy vào đây đấy chứ
253
484
198
t vừa bổ sung k css đó, có điều nó sẽ xấu hơn thôi
253
484
198
nếu muốn nó giãn ra chút thì thêm cellpadding="10" vào table nha