تگ <input>
تگ input برای ساختن فیلدها در یک فرم یا در یک مکانی از صفحه سایت به کار می رود. با این تگ می توانیم فیلدهایی با حالت های ورود داده مختلفی ایجاد کنیم.
نمونه:
<form action="/action_page.php">
<label for="fname">نام:</label>
<input type="text" id="fname" name="fname"><br><br>
<label for="lname">ایمیل:</label>
<input type="text" id="email" name="email"><br><br>
<label for="phone">شماره تماس:</label>
<input type="tel" id="phone" name="phone"><br><br>
<label for="password">رمزعبور:</label>
<input type="password" id="password" name="password"><br><br>
<label for="email">تاریخ:</label>
<input type="date" id="email" name="email"><br><br>
<input type="submit" value="ارسال اطلاعات">
</form>
پیش نمایش:
https://betalk.w3spaces.com/inputs.html
توجه:
ما در فرم بالا از برچسب ها هم استفاده کردیم. برای مثال: <label for="fname">نام:</label>
این قسمت اختیاری است. اما اگر خواستید برچسب استفاده کنید و یک عنوان کنار فیلدها نمایش دهید، حتما فراموش نکنید که در قسمت for="fname"
پارامتر id="fname"
که در تگ input مرتبط با آن استفاده شده را وارد کنید. درواقع لیبل و input باید به یکدیگر متصل باشند.
در تگ input استفاده از پارامتر type
باعث می شود که نحوه عملکرد و حالت ورود اطلاعات یک فیلد تغییر کند. برای مثال در کد بالا در فیلد رمزعبور ما type="password"
را استفاده کرده ایم که اگر وارد قسمت پیش نمایش این تگ شوید، می بینید که اطلاعات وارد شده در این فیلد به صورت ستاره ای نمایش داده می شود.
انواع مختلفی از فیلدها وجود دارد که می توانید استفاده کنید:
<input type="button">
<input type="checkbox">
<input type="color">
<input type="date">
<input type="datetime-local">
<input type="email">
<input type="file">
<input type="hidden">
<input type="image">
<input type="month">
<input type="number">
<input type="password">
<input type="radio">
<input type="range">
<input type="reset">
<input type="search">
<input type="submit">
<input type="tel">
<input type="text">
<input type="time">
<input type="url">
<input type="week">
سایر اطلاعات و همچنین پارامترهای دیگر تگ input
را می توانید از این لینک مطالعه کنید:
https://www.w3schools.com/tags/tag_input.asp