معرفی input- password, input-file, hidden fields , button, image button, label tag

در سلسله آموزشهای طراحی سایت آنلاینر به معرفی کامل Checkbox, radio, select-option, textarea پرداختیم.

در این مقاله قصد بررسی معرفی input- password, input-file, hidden fields , button, image button, hidden fields, label tag را داریم.

input- password:

تگ ورودی دیگری نیز وجود دارد که اصولا برای وارد کردن پسورد  کاربران استفاده میشود. مزیت این فیلد ورودی این است که متن وارد شده توسط کاربر توسط کاراکتر نقطه نمایش داده میشود. کد زیر مثال کاملی از این فیلد است.

[html]</pre>
<form>رمز ورود: <input style="background-image: url(‘data:image/gif;base64,R0lGODlhEAAQAPZVADsBAkECBFEGCmQDBGoEB3UIDWcOEn0dHnZGRnhBQntbXIILEoIMEoENFI8QGI0UHJMQGKERGqURGq4QGIsaIZ4fJq8WI68YJrQXJLIZJbgZJ7gZKLwcK74dLa4gKq4iLLUgLaApMLwpNrwsOKUzOcAfL8EhMcUjM8YkNMgoOJw+QKY8QtA5Sdo/T6dARa5FS6tOUr9MUqRRVrRVWY9pa5BmaZBqbMRKVNlRYclud/14iLyIiKuoqNGbneyPmfOAkPeElNGvsNO3t+aorfGjq+y/w8zMzNXU1N3S0t7W1t3a2uLR0e3U1vLd4OLh4ejo6Png4/bx8ff09Pr5+f7+/v///wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAACH5BAEAAFYALAAAAAAQABAAAAfEgFaCVlCFhoWDgzk6QD+Oj0A6OYMyLSwdJR2amywtMoITKZgbFRsYIRqaKROCEpgZO1IkMFM7GJgSghGZKEVVQktVQyclJRG6JR8uM1NVVVEvKx7GyDHO11VUVTHUVgEECUlIR+RHSUoJBAGCAAMHKgpO8koIKgcDAIICCwwGRk89gjzhUYABAwGCGly4IIIIkxE3mvgAkeFCA0EPMBQ7gcNEio7FMDwQVAOCBQ6bNnGwAKHGIBoUHMicKZOCjUQ4cw4KBAA7’); padding-right: 18px; background-repeat: no-repeat; background-attachment: scroll; background-position: right center; border: 1px solid #c01f2f; width: 146px;" type="password" name="pwd" /></form>
<pre>
[/html]

input-file:

این فیلد ورودی به طراح وب سایت این امکان را میدهد که بتواند از کاربر فایلی را دریافت کند. برای این کار میتوانید از تکه کد زیر بعنوان یک مثال استفاده نمایید.

[html]</pre>
<form>لطفا فایل مورد نظر خود را برای آپلود انتخاب نمایید:

<input type="file" name="datafile" /></form>
<pre>
[/html]

label :

تگی نیز در html  وجود دارد که وظیفه درج یک برچسب را در صفحه وب شما را دارد. به مثال زیر توجه کنید:

[html]

My Page

</pre>
<form action="demo_form.asp"><label for="male">مرد</label>
<input id="male" type="radio" name="jender" value="male" />

<label for="female">زن</label>
<input id="female" type="radio" name="jender" value="female" />

<input type="submit" value="Submit" /></form>
<pre>

[/html]

صفتی به نام for نیز برای تگ label  استفاده میشود که برچسب مورد نظر شما را به فیلد ورودی مربوطه انتساب میدهد.

در آموزش بعد به اسکریپت ها و embed کردن عناصر میپردازیم.

با آنلاینر همراه شوید …