آموزش HTML(قسمت سوم): مثال های اساسی HTML

آموزش HTML(قسمت سوم): در قسمت دوم(ویرایشگر HTML) نحوه ی چگونگی ویرایش یک سند HTML را آموختیم. حال قبل از هر کاری برای درک آسان تر HTML باید به مثال های اساسی زیر توجه و تسلط کامل پیدا کنید.

مثال های اساسی html
مثال های اساسی HTML ، آموزش رایگان HTML

در این آموزش برخی از مثالهای اساسی HTML را نشان خواهیم داد.

اگر ما از برچسب هایی استفاده می کنیم که شما هنوز در مورد آنها یاد نگرفته اید نگران نباشید!

آموزش HTML(قسمت سوم) | اسناد HTML:

همه اسناد HTML باید با اعلامیه نوع سند(< ! DOCTYPE html >) شروع شوند، با استفاده از این اعلامه به مرورگر اعلام میکنم که سند یا فایل اراعه شده یک سند HTML می باشد.

سند HTML خود با < html > آغاز می شود و باسند HTML خود با < html > آغاز می شود و با < / html > پایان می یابد. پایان می یابد.

قسمت قابل مشاهده سند HTML برای کاربر بین < body > و < / body > است.

مثال:

<!DOCTYPE html>
<html>
<body>

<h1>اولین عنوان من</h1>
<p>اولین پاراگراف من</p>

</body>
</html>

پیش نمایش آنلاین

آموزش HTML(قسمت سوم) | اعلامیه < ! DOCTYPE > :

اعلامیه < ! DOCTYPE > نوع سند را نشان می دهد و به مرورگرها برای نمایش صحیح صفحات وب کمک می کند.

اعلامیه < ! DOCTYPE > فقط یک بار باید در بالای صفحه (قبل از هرگونه برچسب HTML) ظاهر شود.

اعلامیه < ! DOCTYPE > به حروف کوچک و بزرگ حساس نیست.

اعلامیه < ! DOCTYPE > برای HTML5 به شرح زیر است:

<!DOCTYPE html>

آموزش HTML(قسمت سوم) | عناوین HTML:

عنوان HTML با برچسب < h1 > تا < h6 > تعریف می شود. < h1 > مهمترین عنوان را تعریف می کند. < h6 > کمترین عنوان را تعریف می کند.

مثال:

<h1>این یک عنوان 1 است </h1>
<h2>این یک عنوان 2 است</h2>
<h3>این یک عنوان 3 است</h3>
<h4>این یک عنوان 4 است</h4>
<h5>این یک عنوان 5 است</h5>
<h6>این یک عنوان 6 است</h6>

پیش نمایش آنلاین

آموزش HTML(قسمت سوم) | پاراگراف های HTML:

پاراگرافهای HTML با برچسب < p > تعریف می شوند.

مثال:

<p>این پاراگراف نمونه می باشد.</p>
<p>این پاراگراف نمونه 2 می باشد.</p>

پیش نمایش آنلاین

آموزش HTML(قسمت سوم) | پیوند یا لینک های HTML:

پیوندهای HTML با برچسب < a > تعریف می شوند.

مثال:

<a href="https://www.w3schools.com">This is a link</a>

پیش نمایش آنلاین

مقصد پیوند در ویژگی href مشخص شده است.

از ویژگی ها برای ارائه اطلاعات اضافی در مورد عناصر HTML استفاده می شود.

درباره ویژگی ها در فصل بعدی بیشتر خواهید آموخت.

آموزش HTML(قسمت سوم) | تصاویر HTML:

تصاویر HTML با برچسب < img > تعریف می شوند.

فایل منبع (src) ، متن جایگزین (alt) ، عرض و ارتفاع به عنوان ویژگی ارائه می شوند.

مثال:

<img src="w3schools.jpg" alt="W3Schools.com" width="104" height="142">

پیش نمایش آنلاین

چگونه می توان سورس یا کد منبع HTML را مشاهده کرد؟

آیا تا به حال یک صفحه وب دیده اید و از خود پرسیده اید “اوه! آنها چگونه این کار را انجام داده اند؟”

مشاهده کد منبع HTML:

در یک صفحه HTML کلیک راست کنید و “View Page Source” (در Chrome) یا “View Source” (در Edge) یا موارد دیگر را در مرورگرهای دیگر انتخاب کنید. با این کار پنجره ای حاوی کد منبع HTML صفحه باز می شود.

یک عنصر HTML را بازرسی کنید:

روی یک عنصر (یا یک قسمت خالی) کلیک راست کنید و “Inspect” یا “Inspect Element” را انتخاب کنید تا ببینید از چه عناصری تشکیل شده اند (HTML و CSS را خواهید دید). همچنین می توانید در پنل Elements یا Styles که باز می شود ، HTML یا CSS را ویرایش کنید.

منبع: W3School

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *