السلام عليكم ورحمة الله وبركاته
ده قالب بسيط عملته دلوقتي متوافق مع الجوال ياعني الرساله في البريد اتكون متوافقه سواء تليفون او كمبيوتر او اي جهاز تاني
هو تصميم بسيط وخفيف
القالب
كود PHP:
<!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=a844368696ede6d6ae6c556bae056261">Back to home</a>
</div>
</div>
<div class="footer">
all copyright @ <a href="https://www.facebook.com/daany10222">Mohamed Yasser</a>
</div>
</div>
</body>