آموزش تگ label در HTML

آموزش تگ label در HTML
دوست من سلام امیدوارم حالتون عالی و پر از انرژی باشید. توی این بخش از آموزش html css قراره که با آموزش تگ label
در HTML به صورت کامل آشنا بشید.
تگ label در HTML
تگ label
تگی است که میتوانیم در صورت استفاده از آن یک برچسب برای تگ اینپوت خود قرار دهیم. کاربرد این تگ بدین شکل است که در صورت قراردادن آن مشخص میکنیم که کاربر در بخش اینپوت چه چیزی را باید وارد کند. برای اینکه برای تگ Input خود یه تگ label قرار دهیم ابتدا باید یک آیدی برای تگ اینپوت مان قرار دهیم و بعد همان آیدی را در تگ لیبل فراخوانی کنیم تا در نتیجه ی راین کار این دو تگ به هم دیگر متصل گردند. در صورت عدم انجام این کار تگ های input , label هم دیگه رو نمیتوانند شناسایی کنند.
دو مثال برای تگ label در HTML
در ادامه دوره آموزشی HTML CSS پروژه محور به چند تا مثال های تگ label
توجه فرمایید.
مثال اول : استفاده کردن از صفت for در تگ label
<body> <form action="files/get_data.php" method="POST"> <label for="UserName">نام شما : </label> <input type="text" name="myname" id="UserName"> <input type="submit" value="ارسال"> </form> </body>
مثال دوم: استفاده کردن از صفت form در تگ label
<body> <form action="#" method="POST" id="MyForm"> <input type="radio" name="gender" id="male"><br> </form> <label for="male" form="MyForm">مرد</label> </body>
راستی اگر دنبال آموزش html css پروژه محور هستید می توانید از دوره ی آموزش وردپرس پوش استفاده کنید. جهت مشاهده ی 28 ساعت ویدیو آموزشی با پشتیبانی مادام العمر روی این لینک کلیک کنید
پشتیبانی مرورگرها از تگ label
در جدول زیر میتوانید مرورگرهای اینترنتی که از تگ label
در HTML پشتیبانی میکنند را مشاهده نمایید و بدانید که آیا از مروگر مورد استفاده شما هم پشتیبانی میکنند یا خیر…
جدول صفات تگ label در HTML
جدول زیر به شما کمک میکند تا صفات تگ label
را به همراه مقادیری را که میتوانیم در این تگ استفاده کنیم را مشاهده نمایید.
پشتیبانی تگ label از صفات و رویدادهای عمومی
تگ label
قابلیت پشتیبانی از تمام صفات عمومی و رویدادهای عمومی در HTML دارد.
نکات و توضیحات
- حتما به این نکته دقت داشته باشید که باید ID درون تگ Input با ID که درون صفت For وجود دارد همانند دستورات زیر یکسان باشند.
<label for="Mard">مرد</label> <input type="radio" id="Mard">
دستورات CSS پیش فرض
اغلب مرورگر ها تگ label
را با کد هایی CSS بصورت زیر نمایش میدهند که این کد ها حالت پیش فرض این تگ میباشد.
label { cursor: default; }
در صورتی که مشکلی دارید و قادر به حل آن نیستید می توانید با ما در تماس باشید
دیدگاهتان را بنویسید