شيخة رواية
02-16-2021, 02:09 AM
كود:
<!doctype html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Email</title>
<style>
.body{
background: #4A235A;
text-align: center;
color:#fff;
font-family: arial,sans-serif;
}
.box{
width:70%;
margin:auto;
background:#633974;
margin-top:100px;
border-bottom:2px solid #F4D03F;
border-radius:15px;
}
.box .title{
background:#7D3C98;
padding:10px;
border-bottom:2px solid #4A235A;
border-radius:0px 0px 5px 5px;
font-family: arial,sans-serif;
}
.box .text{
font-size:16px;
padding:15px;
text-align:center;
font-weight: bold;
}
.box table{
margin-top:10px;
margin:auto;
border-collapse: collapse;
width:80%;
margin-bottom:30px;
}
.box table thead{
background:#8E44AD;
border-left:5px solid #8A40A9;
border-right:5px solid #8A40A9;
}
.box table tbody{
background:#462055;
border-left:5px solid #291432;
border-right:5px solid #291432;
}
.box table tbody td{
padding:10px;
border:1px solid #391846;
}
.box table tbody td:hover{
background:#260A32;
}
.box table tr th{
width:50%;
padding:10px;
}
.footer{
color:#fff;
background:#922B21;
position: fixed;
left: 0;
bottom: 0;
width: 100%;
padding:5px;
}
.footer a{
color:#C39BD3;
text-decoration:none;
}
.button{
width:100%;
margin:auto;
margin-bottom:30px;
}
.button a{
text-decoration:none;
color:#fff;
background:#4B205C;
padding:15px;
border-radius:50px;
}
.button a:hover{
background:#562951;
}
.button a img{
width:20px;
padding-right:10px;
}
</style>
</head>
<body class="body">
<div class="box">
<div class="title">Website Name</div>
<div class="text">I Forgot The Password</div>
<table>
<thead>
<tr>
<th>Your account</th>
<th>Password</th>
</tr>
</thead>
<tbody>
<tr>
<td>Mohamed yasser</td>
<td>123456</td>
</tr>
</tbody>
</table>
<div class="button">
<a href="#"><img src="https://www.flaticon.com/svg/vstatic/svg/0/340.svg?token=exp=1610888056~hmac=a844368696ede6d6 ae6c556bae056261">Back to home</a>
</div>
</div>
<div class="footer">
all copyright @ <a href="https://www.facebook.com/daany10222">Mohamed Yasser</a>
</div>
</div>
</body>
<!doctype html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Email</title>
<style>
.body{
background: #4A235A;
text-align: center;
color:#fff;
font-family: arial,sans-serif;
}
.box{
width:70%;
margin:auto;
background:#633974;
margin-top:100px;
border-bottom:2px solid #F4D03F;
border-radius:15px;
}
.box .title{
background:#7D3C98;
padding:10px;
border-bottom:2px solid #4A235A;
border-radius:0px 0px 5px 5px;
font-family: arial,sans-serif;
}
.box .text{
font-size:16px;
padding:15px;
text-align:center;
font-weight: bold;
}
.box table{
margin-top:10px;
margin:auto;
border-collapse: collapse;
width:80%;
margin-bottom:30px;
}
.box table thead{
background:#8E44AD;
border-left:5px solid #8A40A9;
border-right:5px solid #8A40A9;
}
.box table tbody{
background:#462055;
border-left:5px solid #291432;
border-right:5px solid #291432;
}
.box table tbody td{
padding:10px;
border:1px solid #391846;
}
.box table tbody td:hover{
background:#260A32;
}
.box table tr th{
width:50%;
padding:10px;
}
.footer{
color:#fff;
background:#922B21;
position: fixed;
left: 0;
bottom: 0;
width: 100%;
padding:5px;
}
.footer a{
color:#C39BD3;
text-decoration:none;
}
.button{
width:100%;
margin:auto;
margin-bottom:30px;
}
.button a{
text-decoration:none;
color:#fff;
background:#4B205C;
padding:15px;
border-radius:50px;
}
.button a:hover{
background:#562951;
}
.button a img{
width:20px;
padding-right:10px;
}
</style>
</head>
<body class="body">
<div class="box">
<div class="title">Website Name</div>
<div class="text">I Forgot The Password</div>
<table>
<thead>
<tr>
<th>Your account</th>
<th>Password</th>
</tr>
</thead>
<tbody>
<tr>
<td>Mohamed yasser</td>
<td>123456</td>
</tr>
</tbody>
</table>
<div class="button">
<a href="#"><img src="https://www.flaticon.com/svg/vstatic/svg/0/340.svg?token=exp=1610888056~hmac=a844368696ede6d6 ae6c556bae056261">Back to home</a>
</div>
</div>
<div class="footer">
all copyright @ <a href="https://www.facebook.com/daany10222">Mohamed Yasser</a>
</div>
</div>
</body>