|
إليك طريقة سريعة وبسيطة، لإضافة Icons لنموذج بريدي
الصفحة مجربة على: Chrome, Safari, Opera, Firefox و IE7
مثال مباشر
بناء نموذج بريدي:
| PHP CODE: |
0001
0002
0003
0004
0005
0006
0007
0008
0009
0010
|
<p>
<label>username</label>
<input type='text' name='username' size='30' />
</p>
<p>
<label>password</label>
<input type='password' name='password' size='30' />
</p>
?>
|
إضافة Icon لكل حقل:
| PHP CODE: |
0001
0002
0003
0004
0005
0006
0007
|
<?php form input[type=text] {
background: url(/images/user.png) no-repeat
}
form input[type=password] {
background: url(/images/key.png) no-repeat
}
?>
|
ثم إزاحة الكلمات عن Icon بمقدار معين:
| PHP CODE: |
0001
0002
0003
0004
|
<?php form input {
text-indent: 1.2em;
}
?>
|
يمكن أيضا إضافة Class لكل حقل وعدم استعمال Attribute Selectors إن رغبت بإضافة حقول أخرى لا يوفرها Input Type
|
طريقة سريعة وبسيطة، لإضافة Icons لنموذج بريدي
ارسل الدرس لصديق
طباعة الدرس
