آشنایی با عناصر در HTML

زبان HTML از عناصری تشکیل شده است که با استفاده از آنها میتوانید سایت مورد نظرتان را طراحی کنید. همانطور که قبلا گفتیم این عناصر همانند مصالح ساختمانی هستند که برای ساخت یک ساختمان به آن نیاز داریم. در این فصل با مفهوم عنصر در HTML آشنا میشویم. 


عناصر HTML شامل تگ آغازین ، تگ پایانی و هر چیزی هست که بین آنها قرار میگیرد :

<tagname>Content goes here...</tagname>

 در نمونه کد زیر عنصر پاراگراف را میتوانید مشاهده کنید :

<p>My first paragraph.</p>
تگ آغازین           محتویات عنصر تگ پایانی  
<h1> My First Heading <h1/>
<p> My first paragraph. <p/>
<br>    

 

نکته : عناصر HTML ایی که حاوی محتویات داخلی نیستند عناصر تهی (empty elements) نامیده میشوند.  

 

این عناصر تگ پایانی ندارند مانند عنصر <br>.(این عنصر باعث ایجاد یک خط جدید میشود، همان نقطه سر خط خودمان)


عناصر Nested در HTML

عناصر nested به عناصری گفته میشود که میتوانند عناصر دیگری را در خود جای دهند. به نمونه کد زیر دقت کنید :

<!DOCTYPE html>
<html>
    <body>

        <h1>My First Heading</h1>
        <p>My first paragraph.</p>

    </body>
</html>
خودتان امتحان کنید

در نمونه کد بالا  عنصر <html> یک عنصر nested هست به دلیل اینکه عنصر <body> را در خود جای داده است. 

به همین ترتیب عنصر <body> نیز یک عنصر nested بوده زیرا عناصر <h1> و <p> را در خود جای داده است.


تگ پایانی را فراموش نکنید

اگرچه در بعضی از عناصر HTML میتوان از قرار دادن تگ پایانی صرف نظر کرد ولی اصلا توصیه نمیشود زیرا که در بعضی مواقع باعث ایجاد نتایج غیر قابل انتظار میشود:

<html>
    <body>

        <p>This is a paragraph
        <p>This is a paragraph

    </body>
</html>
خودتان امتحان کنید

نمونه کد بالا بدون مشکل در مرورگر اجرا میشود ولی بهتر است تگ پایانی لحاظ شود.


عناصر Empty در HTML

عناصر HTML ایی که حاوی محتویات داخلی نیستند عناصر empty نامیده میشوند. 

عناصر empty میتوانند در همان تگ آغازین بسته شوند برای مثال : </  br>.

در HTML5 نیاز به بستن عناصر empty نیست اما اگر شما میخواهید کدهایتان برای تجزیه کننده های XML خوانا باشند باید تمام تگ های HTML را ببندید.


تگ ها را با حروف کوچک تایپ کنید

در HTML5 تگ ها case sensitive نیستند یعنی مهم نیست که آنها را با حروف کوچک و یا بزرگ انگلیسی تایپ کنید.

توصیه میشود از حروف کوچک برای تایپ تگ ها استفاده کنید.

منتشر شده در ۲۷ اردیبهشت ۱۳۹۶ حمید رضا ملکی ۱۵۲۱ بازدید
دیدگاه ها
احمد ایرانپور یکشنبه ۲۱ مرداد ۱۳۹۷

با درود چقدر جالب و راحت و قشنگ. ممنون از زحماتتون

حمید رضا ملکی یکشنبه ۲۱ مرداد ۱۳۹۷

ممنون از نظر لطفتون