در این بخش، تگ های اصلی و پرکاربرد HTML به اختصار معرفی می شوند، اچ تی ام ال یک زبان نشانه گذاری اطلاعات متنی، تصویری ، چندرسانه ای و … در صفحات وب است.
تگ های اصلی
|
کاربرد |
تگ |
|
عنوان با درجه های یک تا شش |
h1 , h2 , h3, h4 , h5 ,h6 |
|
تعیین صفحه وب |
html |
|
ایجاد بخش تعاریف و تنظیمات صفحه |
head |
|
تعیین متن نوار عنوان پنجره مرورگر |
title |
|
ایجاد بخش بدنه صفحه |
body |
|
شکستن خط |
br |
|
ایجاد پاراگراف |
p |
|
نوشتن توضیحات |
<!– –> |
تگ های جدول بندی
|
کاربرد |
تگ |
|
تعریف جدول |
table |
|
تعریف عنوان جدول |
thead |
|
تعریف بدنه جدول |
tbody |
|
تعریف فوتر جدول |
tfoot |
|
تعریف سطر |
Tr |
|
تعریف سلول عنوان |
Th |
|
تعریف سلول |
Td |
مثال از جدول :
تگ های فرم
|
تگ |
کاربرد |
|
form |
ساخت فرم |
|
input |
ساخت شکل های مختلف ورودی |
|
select |
ساخت لیست باکس و کمبوباکس |
|
option |
تعریف آیتم برای لیست ها |
|
textarea |
تعریف جعبه متن طولانی |
تگ input یک خاصیت بنام type دارد که مطابق جدول زیر مقدار گرفته و شکل ورودی را تعیین می کند:
|
نوع input |
کاربرد |
|
Text |
جعبه‌ی ورود متن یک سطری |
|
Password |
جعبه متن دریافت کلمه عبور |
|
Radio |
دکمه رادیویی |
|
Checkbox |
جعبه انتخاب |
|
File |
انتخاب و ارسال فایل |
|
Hidden |
نگهداری اطلاعات مخفی |
|
Button |
دکمه فشاری |
|
Submit |
دکمه برای ارسال فرم به سرویس دهنده |
|
Reset |
دکمه بازنویسی اطلاعات فرم |
مثال از فرم:
<html>
<body>
<form action="page2.php" method="post" enctype="multipart/form-data">
<table width="300" align="center" border="1">
<tr><th colspan="2" > Student Info </th></tr>
<tr>
<td> name </td>
<td><input type="text" name="nam" /></td>
</tr>
<tr>
<td> famliy </td>
<td><input type="text" name="fam" /></td>
</tr>
<tr>
<td> password </td>
<td><input type="password" name="pass" /></td>
</tr>
<tr>
<td> gender </td>
<td>
<input type="radio" name="gen" value="1" /> male
<input type="radio" name="gen" value="2" /> female
</td>
</tr>
<tr>
<td> hobbies </td>
<td>
<input type="checkbox" name="mu" /> Music <br />
<input type="checkbox" name="sp" /> Sport
</td></tr>
<tr><td> state </td>
<td>
<select name="field">
<option value="1">Computer </option>
<option value="2">Graphics </option>
<option value="3">Mechanics </option>
</select>
</td></tr>
<tr><td> address </td>
<td><textarea name="addr" cols="50" rows="3"></textarea>
</td></tr>
<tr><td> picture </td>
<td><input type="file" name="pic" /></td>
</tr>
<tr><td> </td>
<td>
<input type="submit" value=" Submit " />
<input type="reset" value=" Clear " />
</td></tr></table>
</form>
</body>
</html>
خروجی:
