مهندس گل محمدی & مهندس حسنی
ساخت فرم ورود بااستفاده از html
html
<div class="registration">
<form>
<label>ایمیل</label>
<input type="text" />
<p class="error"><span>ایمیل شما در دیتابیس موجود است!</span></p>
<label>رمز عبور</label>
<input type="text" />
<p class="error"><span>حداقل 8 کاراکتر</span></p>
<label>تکرار رمز عبور</label>
<input type="text" />
<p class="error"><span>رمز خود را دوباره بنویسید</span></p>
<label>تاریخ تولد</label>
<input type="text" />
<p class="error"><span>متن دلخواه</span></p>
<label>کشور</label>
<select name="country">
<option>ایران</option>
<option>وطنم</option>
</select>
<div class="register_button"><span><a rel="nofollow" href="#">ثبت نام</a></span></div>
</form>
</div>
فایل CSS مورد نیاز
<style type="text/css">
.registration form{
width:220px;
height:330px;
background-color: #106093;
padding: 10px 0px 0px 4px;
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
color: white;
text-transform: uppercase;
font-size: 11px;
font-weight: bold;
font-family: Tahoma;
float:right;
}
.registration input, .registration select{
width: 195px;
height: 20px;
margin: 3px 0px 0px 10px;
border: 0px;
font-weight: bold;
text-align:right;
}
.registration input:focus{
background-color: orange;
}
.registration form label {
text-align: right;
float: right;
margin-right: px;
}
a{
outline:none;
}
.register_button{
width: 149px;
height: 42px;
background-color: orange;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
margin: 15px auto 0px auto;
text-align: center;
cursor: pointer;
clear: both;
}
.register_button span{
font-weight: normal;
font-size: 28px;
font-family: Tahoma;
line-height: 40px;
}
.register_button span a{
text-decoration: none;
color: white;
}
.register_button span a:hover{
color: black;
}
span.error{
margin-right: 20px;
font-size: 9px;
color: orange;
height: 10px;
}
p.error {
margin: 0px 14px 0px 10px;
font-size: 9px;
color: orange;
height: 6px;
padding: 0px 0px 8px 0px;
text-align: left;
text-transform: none;
direction: rtl;
}
</style>
تمرین :
فیلد نام پدر و مدرک تحصیلی را که شامل 4 نوع مدرک باشد را به فرم اضافه نمایید .
جلسه اول :آموزش پیکربندی شبکه در لینوکس
,0px ,} , font ,10px ,right , ,} register ,border radius ,0px 0px , font size , font family tahoma ,webkit border radius
درباره این سایت