728x90
회원가입 인증 메일 폼입니다.
1. 박스형
회원가입 인증 메일
회원가입을 완료하려면 아래 버튼을 클릭하세요.
| 이름: | John Doe |
| 이메일: | john@example.com |
| 인증 링크: | 인증하기 |
인증 링크가 작동하지 않는 경우, 다음 링크를 복사하여 웹 브라우저에 붙여넣으세요:
http://example.com/verify?token=your-verification-token
감사합니다!
인증하기<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>회원가입 인증 메일</title>
<style>
/* 스타일링을 위한 CSS */
.containers {
max-width: 400px;
margin: 0 auto;
padding: 20px;
background-color: #fff;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
.table {
width: 100%;
}
.table tr td {
padding: 10px;
}
.btns {
display: inline-block;
padding: 10px 20px;
background-color: #007BFF;
color: #fff;
text-decoration: none;
border-radius: 5px;
}
</style>
</head>
<body>
<div class="containers">
<h2>회원가입 인증 메일</h2>
<p>회원가입을 완료하려면 아래 버튼을 클릭하세요.</p>
<table class="table">
<tr>
<td>이름:</td>
<td>John Doe</td>
</tr>
<tr>
<td>이메일:</td>
<td>john@example.com</td>
</tr>
<tr>
<td>인증 링크:</td>
<td><a href="#">인증하기</a></td>
</tr>
</table>
<p>인증 링크가 작동하지 않는 경우, 다음 링크를 복사하여 웹 브라우저에 붙여넣으세요:</p>
<p>http://example.com/verify?token=your-verification-token</p>
<p>감사합니다!</p>
<a class="btns" href="#">인증하기</a>
</div>
</body>
</html>
2. 심플형
회원 가입 인증 메일
안녕하세요 회원님, 저희 서비스에 회원 가입해주셔서 감사합니다. 회원님의 계정을 인증하기 위해 아래의 링크를 클릭해주세요.
인증 링크인증 링크를 클릭하시면 회원님의 계정이 인증되며, 이후 서비스를 이용하실 수 있습니다. 인증 링크는 24시간 동안 유효하며, 만약 인증 링크를 클릭하지 않을 경우 회원님의 계정은 자동으로 삭제될 수 있습니다.
감사합니다.
[서비스 이름] 드림
<!DOCTYPE html>
<html>
<head>
<title>회원 가입 인증 메일</title>
</head>
<body>
<h1>회원 가입 인증 메일</h1>
<p>안녕하세요 회원님, 저희 서비스에 회원 가입해주셔서 감사합니다. 회원님의 계정을 인증하기 위해 아래의 링크를 클릭해주세요.</p>
<a href="https://example.com/verify?token=인증토큰">인증 링크</a>
<p>인증 링크를 클릭하시면 회원님의 계정이 인증되며, 이후 서비스를 이용하실 수 있습니다. 인증 링크는 24시간 동안 유효하며, 만약 인증 링크를 클릭하지 않을 경우 회원님의 계정은 자동으로 삭제될 수 있습니다.</p>
<p>감사합니다.</p>
<p>[서비스 이름] 드림</p>
</body>
</html>
3. 박스형 2
회원가입 인증 메일
안녕하세요, 사용자님!
회원가입을 축하드립니다. 회원가입 인증을 위해 아래의 내용을 확인해주세요.
| 이름: | 홍길동 |
| 이메일: | test029@naver.com |
| 인증 링크: | 인증하기 |
인증 링크가 작동하지 않는 경우, 다음 링크를 복사하여 웹 브라우저에 붙여넣으세요:
http://example.com/verify?token=your-verification-token
인증을 완료하신 후에는 서비스를 이용하실 수 있습니다. 감사합니다!
<!DOCTYPE html>
<html>
<head>
<title>회원가입 인증 메일</title>
<style>
.container3 {
max-width: 500px;
margin: 20px auto;
padding: 20px;
background-color: #fff;
border-radius: 5px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
}
.h13 {
color: #333;
font-size: 24px;
}
.p3 {
color: #555;
font-size: 16px;
margin-bottom: 20px;
}
.table3 {
width: 100%;
border-collapse: collapse;
}
.table3 td {
padding: 10px;
border-bottom: 1px solid #ddd;
}
.btn3 {
display: inline-block;
padding: 10px 20px;
background-color: #007BFF;
color: #fff;
text-decoration: none;
border-radius: 5px;
}
.footer3 {
margin-top: 20px;
text-align: center;
color: #777;
font-size: 14px;
}
.header3 {
padding: 20px;
text-align: center;
background-color: #009688;
color: #fff;
}
.header3 h1 {
font-size: 36px;
}
.main-content {
padding: 20px;
}
.main-content p {
font-size: 24px;
}
.main-content a {
font-size: 24px;
color: #009688;
}
.main-content table {
width: 100%;
border-collapse: collapse;
}
.main-content table td {
padding: 10px;
border-bottom: 1px solid #ddd;
}
.main-content table tr:nth-child(even) {
background-color: #f2f2f2;
}
.main-content .copy-link {
padding: 20px;
text-align: center;
}
.main-content .copy-link p {
font-size: 24px;
}
.main-content .copy-link a {
font-size: 24px;
color: #009688;
}
.main-content .footer3 {
margin-top: 20px;
text-align: center;
color: #777;
font-size: 14px;
}
</style>
</head>
<body>
<div class="container3">
<div class="header3">
<h1 class="h13">회원가입 인증 메일</h1>
</div>
<div class="main-content">
<p class="p3">안녕하세요, 사용자님!</p>
<p class="p3">회원가입을 축하드립니다. 회원가입 인증을 위해 아래의 내용을 확인해주세요.</p>
<table class="table3">
<tr>
<td>이름:</td>
<td>홍길동</td>
</tr>
<tr>
<td>이메일:</td>
<td>test029@naver.com</td>
</tr>
<tr>
<td>인증 링크:</td>
<td><a href="http://example.com/verify?token=your-verification-token" class="btn3">인증하기</a></td>
</tr>
</table>
<p class="p3">인증 링크가 작동하지 않는 경우, 다음 링크를 복사하여 웹 브라우저에 붙여넣으세요:</p>
<p class="copy-link p3">http://example.com/verify?token=your-verification-token</p>
<p class="p3">인증을 완료하신 후에는 서비스를 이용하실 수 있습니다. 감사합니다!</p>
</div>
<div class="footer3">
감사합니다!
</div>
</div>
</body>
</html>
728x90
'nodejs' 카테고리의 다른 글
| 노드js에서 db 연결방법 (0) | 2023.09.29 |
|---|---|
| nodejs 서버와 클라이언트가 서로 다를경우 로그인 처리방법 (0) | 2023.09.10 |
| nodejs에서 로컬 Date 포맷을 YYMMDDHHmmss로 가져오는 방법 (0) | 2023.09.04 |
| nodejs에서 이메일 보내기 (0) | 2023.09.03 |
| Nodejs에서 암호화 복호화 하기 (0) | 2023.09.02 |