### مقدمه
HTML (HyperText Markup Language) زبان نشانهگذاری اصلی برای ایجاد صفحات وب است. این زبان به ما این امکان را میدهد که ساختار و محتوای صفحات وب را تعریف کنیم. در این مقاله، به بررسی تگهای اساسی HTML و کاربردهای آنها میپردازیم.
### تگهای اساسی HTML
1. **تگ `<html>`**
- این تگ به عنوان ریشهی یک سند HTML عمل میکند و تمام محتوای صفحه را در بر میگیرد.
- مثال:
```html
<html>
<!-- محتوا -->
</html>
```
2. **تگ `<head>`**
- این تگ شامل اطلاعات متا، عنوان صفحه و لینکهای به فایلهای CSS و جاوا اسکریپت است.
- مثال:
```html
<head>
<title>عنوان صفحه</title>
</head>
```
3. **تگ `<title>`**
- عنوان صفحه را مشخص میکند و در نوار عنوان مرورگر نمایش داده میشود.
- مثال:
```html
<title>صفحه اصلی من</title>
```
4. **تگ `<body>`**
- محتوای اصلی صفحه وب را در بر میگیرد، شامل متن، تصاویر و سایر عناصر.
- مثال:
```html
<body>
<h1>سلام دنیا!</h1>
</body>
```
5. **تگهای عنوان (`<h1>` تا `<h6>`)**
- برای ایجاد عناوین و زیرعناوین استفاده میشوند. `<h1>` بزرگترین و `<h6>` کوچکترین است.
- مثال:
```html
<h1>عنوان اصلی</h1>
<h2>زیرعنوان</h2>
```
6. **تگ `<p>`**
- برای ایجاد پاراگرافها استفاده میشود.
- مثال:
```html
<p>این یک پاراگراف است.</p>
```
7. **تگ `<a>`**
- برای ایجاد لینکها استفاده میشود. با استفاده از ویژگی `href` میتوان آدرس لینک را مشخص کرد.
- مثال:
```html
<a href="https://www.example.com">به وبسایت ما بروید</a>
```
8. **تگ `<img>`**
- برای نمایش تصاویر استفاده میشود. با استفاده از ویژگی `src` میتوان آدرس تصویر را مشخص کرد.
- مثال:
```html
<img src="image.jpg" alt="توضیح تصویر">
```
9. **تگ `<ul>` و `<ol>`**
- برای ایجاد لیستهای نامرتب و مرتب استفاده میشوند.
11. **تگ `<span>`**
- این تگ برای گروهبندی متن یا عناصر درون خطی استفاده میشود. معمولاً برای اعمال استایل به بخشهای خاصی از متن به کار میرود.
- مثال:
```html
<p>این یک <span style="color: red;">متن قرمز</span> است.</p>
```
12. **تگ `<strong>` و `<em>`**
- تگ `<strong>` برای تأکید بر روی متن و نمایش آن به صورت پررنگ استفاده میشود، در حالی که `<em>` برای تأکید و نمایش متن به صورت ایتالیک به کار میرود.
- مثال:
```html
<p>این یک متن <strong>مهم</strong> است و این یک متن <em>تأکید شده</em> است.</p>
```
13. **تگ `<table>`**
- برای ایجاد جداول استفاده میشود. این تگ شامل تگهای `<tr>` (ردیف)، `<th>` (سرستون) و `<td>` (سلول) است.
- مثال:
```html
<table>
<tr>
<th>نام</th>
<th>سن</th>
</tr>
<tr>
<td>علی</td>
<td>25</td>
</tr>
</table>
```
14. **تگ `<form>`**
- برای ایجاد فرمها و جمعآوری دادهها از کاربران استفاده میشود. این تگ شامل عناصر مختلفی مانند `<input>`, `<textarea>`, و `<button>` است.
- مثال:
```html
<form>
<label for="name">نام:</label>
<input type="text" id="name" name="name">
<button type="submit">ارسال</button>
</form>
```
15. **تگ `<input>`**
- برای دریافت ورودی از کاربر استفاده میشود. نوع ورودی با استفاده از ویژگی `type` مشخص میشود (مانند `text`, `password`, `email` و غیره).
- مثال:
```html
<input type="email" placeholder="ایمیل خود را وارد کنید">
```