Tryit Editor - Free-Learn

<!DOCTYPE html>
<html>
<head>
<style>

*{
 box-sizing: border-box;
}

body{
 background-color:#f2f2f2;
 font-family:tahoma;
 font-size:14px;
 direction:rtl;
}

.MyBox{
 background-color:#fff;
 box-shadow: 2px 5px 30px rgba(0,0,0,.1);
 padding:10px;
 max-width:800px;
 margin:20px auto;
}

.text-center{
 text-align:center;
}

input[type=text],input[type=email]{
 width: 100%;
 padding: 12px;
 border: 1px solid #ccc;
 border-radius: 20px;
 box-sizing: border-box;
 margin-top: 6px;
 margin-bottom: 16px;
}

input[type=submit]{
 background-color: #607D8B;
 color: white;
 padding: 12px 20px;
 border: none;
 border-radius: 5px;
 cursor: pointer;
 width:100%;
}

input[type=submit]:hover{
 background-color: #45a049;
}

.container{
 padding: 10px;
}

</style>
</head>
<body>

<div class="MyBox">
<h3 class="text-center">فرم ارسال گزارش</h3>
<div class="container">
 <form action="#" method="post">
  <label for="u_name">نام شما :</label>
  <input type="text" id="u_name" name="name_user" placeholder="نام شما در اینجا" required>
  <label for="u_email">ایمیل شما :</label>
  <input type="email" id="u_email" name="email_user" placeholder="ایمیل شما در اینجا" required>
  <label for="url_page">آدرس این صفحه :</label>
  <input type="text" id="url_page" name="page_url" disabled dir="ltr">
  <input type="submit" value="ارسال گزارش">
 </form>
</div> 
</div>

var My_URL = location.href;
document.getElementById("url_page").value = My_URL;

</script>

</body>
</html>

سایت آموزشی فری لرن