مثال های اساسی HTML
در این قسمت برخی از مثال های اساسی HTML را نشان خواهیم داد . در این قسمت از برچسب هایی (تگ – tag) استفاده می کنیم که شما هنوز در مورد آنها یاد نگرفته اید .
اسناد HTML
همه اسناد HTML باید با اعلامیه نوع سند شروع شوند <!DOCTYPE html>:.
سند HTML با تگ خودش شروع می شود <html>و با آن پایان می یابد </html>.
قسمت قابل مشاهده سند HTML بین تگ<body>و تگ بسته</body> است .
مثال:
|
۱
۲
۳
۴
۵
۶
۷
|
<!DOCTYPE html>
<html> <body> <h1>My First Heading</h1> <p>My first paragraph.</p> </body> </html> |
اعلامیه <! DOCTYPE>
<!DOCTYPE>اعلام نشان دهنده نوع سند است ، و کمک می کند تا مرورگر صفحات وب را نمایش دهد .
این فقط یک بار باید در بالای صفحه (قبل از هرگونه برچسب HTML) قرار گیرد.
<!DOCTYPE>اعلان حروف حساس نیست.
<!DOCTYPE>اعلامیه برای HTML5 است:
<!DOCTYPE html>
عناوین HTML
عناوین HTML با برچسب های <h1> تا <h6> تعریف می شوند .
<h1>مهمترین عنوان را تعریف می کند . <h6>کمترین عنوان را تعریف می کند :
|
۱
۲
۳
|
<h1>This is heading 1</h1>
<h2>This is heading 2</h2> <h3>This is heading 3</h3> |
پاراگراف های HTML
پاراگراف های HTML با برچسب <p> تعریف می شوند :
پیوندهای HTML
پیوند های HTML با برچسب <a> تعریف می شوند :
مثال
|
۱
|
<a href=”https://www.w3schools.com”>This is a link</a>
|
مقصد پیوند در ویژگی href مشخص شده است . از ویژگی ها برای ارائه اطلاعات اضافی در مورد عناصر HTML استفاده می شود.
درباره ویژگی ها در مقالات بعدی بیشتر خواهید آموخت .
تصاویر HTML
تصاویر HTML با برچسب <img> تعریف می شوند.
فایل منبع ( src) ، متن جایگزین ( alt) widthو heightبه عنوان ویژگی ارائه می شوند:
مثال
|
۱
|
<img src=”w3schools.jpg” alt=”W3Schools.com” width=”۱۰۴″ height=”۱۴۲″>
|
چگونه می توان منبع HTML را مشاهده کرد؟
آیا تا به حال یک صفحه وب دیده اید و از خود پرسیده اید ” آنها چگونه این کار را انجام داده اند؟”
مشاهده کد منبع HTML:
در یک صفحه HTML کلیک راست کنید و “View Page Source” (در Chrome) یا “View Source” (در Edge ) یا موارد دیگر را در مرورگر های دیگر انتخاب کنید. با این کار پنجره ای حاوی کد منبع HTML صفحه باز می شود.
یک عنصر HTML را بازرسی کنید:
روی یک عنصر (یا یک قسمت خالی) کلیک راست کنید و “Inspect” یا “Inspect Element” را انتخاب کنید تا ببینید از چه عناصری تشکیل شده اند (HTML و CSS را خواهید دید). همچنین می توانید در پنل Elements یا Styles که باز می شود ، HTML یا CSS را هنگام تغیرات ویرایش کنید.
تمامی مراحل آموزشی این دوره در آدرس HTML قرار دارد.
منتظر نظرات و پیشنهادات زیبای شما هستم .