سلام پی وی لرنی های عزیز!
به دوره آموزش تگ های HTML خوش آمدید!
HTML یا Hypertext Markup Language یک نوع زبان نشانهگذاری استاندارد برای ایجاد صفحات اینترنت و وب محسوب می شود.
می توان ادعا کرد که HTML دروازه ورود و پیشرفت برای یادگیری سایر زبان های برنامه نویسی هم چون CSS و جاوا اسکریپت است.
HTML ساختار و اسکلت صفحات وب را تشکیل می دهد و بدون آن نمی توان هیچ صفحه وبی را ساخت.
دوست دارید طراح وب شوید؟
خب باید HTML را بیاموزید!
نگران نشوید! یادگیری HTML کار دشواری نیست و با کمی تلاش خیلی زود در آن استاد می شوید.
در جلسه قبل آموختیم که چگونه از تگ footer استفاده نمایییم؛ تگ footer تگی است که که به کمک آن می توان بخش فوتر یا بخش پایینی یک صفحه وب را تنظیم نمود.
در این جلسه آموزش کار با تگ form در HTML را به علاقمندان این دوره ارائه می نماییم.
به مثال زیر توجه نمایید.
در این مثال یک فرم HTML یا HTML form وجود دارد که دارابی دو زمینه ورودی و یک دکمه ارسال است.
1 2 3 4 5 | <form action="/action_page.php" method="get"> First name: <input type="text" name="fname"><br> Last name: <input type="text" name="lname"><br> <input type="submit" value="Submit"> </form> |
همان طور که تا به حال متوجه شده اید تگ form تگی است که از آن برای ایجاد فرم در صفحات وب استفاده می شود.
یک تگ فرم می تواند شامل چند عنصر فرم، از قبیل موارد زیر شود.
عنصر | |||||
<form> | بله | بله | بله | بله | بله |
HTML5 دو خصیصه جدید خصیصه autocomplete و خصیصه novalidate را اضافه کرده و خصیصه accept را حذف نموده است.
در XHTML خصیصه name غیر معتبر شده است و باید به جای آن از خصیصه global id استفاده نمایید.
خصیصه | مقدار | توضیحات |
---|---|---|
accept | file_type | این خصیصه نوع فایل هایی که کاربر می تواند آن ها را آپلود کند مشخص می نماید. این خصیصه در HTML5 پشتیبانی نمی شود. |
accept-charset | character_set | این خصیصه نحوه کدگذاری کاراکترهایی را که برای ارسال فرم استفاده می شود را مشخص می نماید. |
action | URL | مشخص میکند که داده های یک فرم کجا ارسال شوند. |
autocomplete | on off | قابلیت تکمیل خودکار فیلدهای فرم را مشخص می نماید. |
enctype | application/x-www-form-urlencoded multipart/form-data text/plain | این خصیصه نحوه ی کدگذاری داده های یک فرم را در هنگام ارسال به سرور مشخص می کند. |
method | get post | این خصیصه چگونگی ارسال داده های یک فرم را به سرور مشخص می کند. |
name | text | یک نام را برای فرم تعیین می نماید. |
novalidate | novalidate | این فرم تعیین می نماید که داده های یک فرم در هنگام ارسال به سرور اعتبارسنجی نشوند. |
target | _blank _self _parent _top | نحوه نمایش صفحه مقصد را تعیین می نماید. |
تگ <form> از خصیصه های سراسری در HTML پشتیبانی می کند.
تگ <form> از خصیصه رویداد در HTML پشتیبانی می کند.
یک form به همراه چک باکس:
1 2 3 4 5 6 7 8 9 10 11 12 | <!DOCTYPE html> <html> <body> <form action="/action_page.php" method="get"> <input type="checkbox" name="vehicle" value="Bike"> I have a bike<br> <input type="checkbox" name="vehicle" value="Car" checked="checked"> I have a car<br> <input type="submit" value="Submit"> </form> </body> </html> |
یک form با دو چک باکس و یک دکمه ارسال:
1 2 3 4 5 6 7 8 9 10 11 12 13 | <!DOCTYPE html> <html> <body> <form action="/action_page.php" method="get"> <input type="radio" name="gender" id="male" value="male"> Male<br> <input type="radio" name="gender" id="female" value="female" checked="checked"> Female<br> <input type="radio" name="gender" id="other" value="other"> Other<br><br> <input type="submit" value="Submit"> </form> </body> </html> |
بیشتر مرورگرها عنصر <form> را با مقادیر پیش فرض زیر نمایش می دهند:
1 2 3 4 | form { display: block; margin-top: 0em; } |
در این جلسه با آموزش کار با تگ form در HTML در خدمت شما بودیم و آموختیم که از این تگ می توان برای ایجاد فرم ها استفاده کرد.
در جلسه آینده به آموزش تگ frame خواهیم پرداخت.
با پی وی لرن همراه باشید.