• آموزش html
  • تهران کد

اتریبیوت های فرم

اکتبر 25, 2017adminskآموزش htmlبدون دیدگاه

اتریبیوت value

با این اتریبیوت می توان یک مقدار پیش فرض را در فرم قرار داد.

<!DOCTYPE html>
<html>
<body>
<form action="">
First name:<br>
<input type="text" name="firstname" value="John">
<br>
Last name:<br>
<input type="text" name="lastname">
</form>
</body>
</html>

خروجی:

value در فرم html

اتریبیوت readonly

به کمک این صفت میتوان قابلیتی را برای فرم ایجاد کرد که مقدار پیش فرض آن قابل تغییر نبوده و صرفا به کاربر نشان داده شود.

<!DOCTYPE html>
<html>
<body>
<form action="">
First name:<br>
<input type="text" name="firstname" value ="John" readonly>
<br>
Last name:<br>
<input type="text" name="lastname">
</form>
</body>
</html>

مشاهده خروجی و ویرایش آنلاین

اتریبیوت disable

این صفت باعث غیر فعال شدن فرم شده و همچنین مقدار پیش فرضش را هنگام ارسال، ارسال نمی نماید.

<!DOCTYPE html>
<html>
<body>
<form action="">
First name:<br>
<input type="text" name="firstname" value ="John" disabled>
<br>
Last name:<br>
<input type="text" name="lastname">
</form>
</body>
</html>

مشاهده خروجی و ویرایش آنلاین

اتریبیوت maxlenght و size

با اتریبیوت size میتوان طول فرم را برحسب کاراکتر ها کوچک یا بزرگ نمود.

با اتریبیوت maxlenght میتوان تعداد ورودی های مجاز برای یک فرم را بر حسب کاراکتر محدود نمود.

<!DOCTYPE html>
<html>
<body>
<form action="">
First name:<br>
<input type="text" name="firstname" maxlength="10">
<br>
Last name:<br>
<input type="text" name="lastname" size="24">
</form>
</body>
</html>

مشاهده خروجی و ویرایش آنلاین

اتریبیوت های html5 در فرم

اتریبیوت autocomplete

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

<!DOCTYPE html>
<html>
<body>
<form action="/action_page.php" autocomplete="on">
  First name:<input type="text" name="fname"><br>
  Last name: <input type="text" name="lname"><br>
  E-mail: <input type="email" name="email" autocomplete="on"><br>
  <input type="submit">
</form>
</body>
</html>

مشاهده خروجی و ویرایش آنلاین

اتریبیوت placeholder  و required

اتریبیوت placeholder یک متن نگه دارنده برای فرم قرار می دهد.

اتریبیوت required پر کردن فرم را ضروری می کند.

<!DOCTYPE html>
<html>
<body>
<form action="/action_page.php">
  <input type="text" name="fname" placeholder="First name"><br>
  <input type="text" name="lname" placeholder="Last name" required><br>
  <input type="submit" value="Submit">
</form>
<p><strong>Note:</strong> The placeholder attribute of the input tag is not supported in Internet Explorer 9 and earlier versions.</p>
</body>
</html>

مشاهده خروجی و ویرایش آنلاین

اتریبوت pattern

با این صفت میتوان تعداد کاراکتر های ورودی در فرم و همچنین محدوده کاراکتر های مجاز ( حروف کوچک، حروف بزرگ،  اعداد) را برای یک فرم تعیین نمود.

<!DOCTYPE html>
<html>
<body>
<form action="/action_page.php">
  Country code: <input type="text" name="country_code" pattern="[A-Za-z0-9]{3}" title="Three letter country code">
  <input type="submit">
</form>
<p><strong>Note:</strong> The pattern attribute of the input tag is not supported in Internet Explorer 9 and earlier versions, or in Safari.</p>
</body>
</html>

مشاهده خروجی و ویرایش آنلاین

 

 

دیدگاهتان را بنویسید لغو پاسخ

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

بخش بندی آموزش HTML

  • آموزش html مقدمه
  • شروع کار با HTML در رایانه شخصی
  • مفاهیم پایه‌ای HTML
  • المان های HTML
  • صفت یا اتریبیوت ها در HTML
  • تگ های عنوان در HTML
  • پاراگراف ها در HTML
  • استایل دهی مستقیم به تگ ها
  • فرمت دهی به متن در HTML
  • نقل قول و عناصر استنادی در HTML
  • رنگ ها در html
  • css در HTML
  • لینک ها در HTML
  • عکس ها در HTML
  • جدول ها در HTML
  • لیست ها در html
  • المان های block و inline
  • تگ iframe در html
  • تگ script در HTML
  • تگ head در html
  • صفحه چینی در html
  • HTML واکنشگرا
  • کاراکتر های رزرو شده
  • فرم ها در HTML
  • سایر تگ ها در فرم
  • input type های مختلف در فرم
  • اتریبیوت های فرم
  • ویدیو در HTML
  • پخش صدا در html