اچ‌تی‌ام‌ال/مقدمه

از ویکی‎نسک، کتاب‌خانه آزاد.

پرش به: ناوبری, جستجو

برای ساخت یک فایل اچ‌تی‌ام‌ال یک ویرایشگر مناسب یا برنامه Notepad را بازکنید و تگ‌های زیر را در آن وارد نمایید.

<Html>
</html>

حال تکه کد نوشته شده را با نام دلخواه اما با پسوند HTML ذخیره کنید، مثلا: example.html سپس بر روی فایل ذخیره شده کلیک کرده و مشاهده می‌کنید که پنجره مرورگر شما باز می‌شود و صفحه‌ی خالی را نشان مي‌دهد. شما همین حالا اولین و کوچکترین برنامه را تحت زبان HTML نوشته‌اید. همانطور که مشاهده کردید در زبان HTML دو تگ شروع و پایان وجود دارد که تگ شروع <...> و تگ پایان <.../> بدین شکل می‌باشد.

دو تگ شروع و پایان HTML که پیش تر آن‌ها را نشان دادیم به معنای آن هستند که هر آنچه در بین آن‌ قرار گیرد به زبان HTML تعبیر می‌شود و لازم به ذکر است که در آغاز و پایان هر صفحه که به زبان HTML نوشته شود، استفاده از این دو تکه کد اجباری می‌باشد.

حال می‌خواهیم در این سند متنی را وارد کنیم، برای اینکار تکه‌ کد‌های زیر را وارد می‌کنیم:

<Html>
سلام، من یک برنامه نویس HTML هستم.
</html>

همانطور که مشاهده می‌کنید زبان فارسی از چپ آغاز شده است که باید به راست بیاید و همینطور این هیچ بخش بندی روی تکه کد‌های ما صورت نگرفته است، بنابر این باید کدها را اصلاح نماییم و خط آغازین متن را از جپ به راست در بیاوریم، برای اینکار صفت Dir را داخل تگ آغازین HTML قرار می‌دهیم، مقدار پیش فرض این صفت Ltr به معنای left to right می‌باشد که ما باید به آن صفت rtl به معنای Right to left را بدهیم.

<Html dir="rtl">
سلام، من یک برنامه نویس HTML هستم.
</html>

حال که کد نویسی را به پایان رساندیم، سند خود را در مجموعه کارکترهای UTF-8 ذخیر کنید، برای اینکار هنگام ذخیره در مقابل Encoding از نوار بازشو این زبان را انتخاب کنید. سپس صفحه را باز کرده و مشاهده می‌کنید که متن به درستی از راست به چپ نمایش داده می‌شود. همچنین برای تخصیص بخش های برنامه نویسی خود می‌توانید از <!-- --> استفاده کنید که در هنگام نمایش سند نشان داده نمی‌شود و فقط نقش راهنما را ایفا مي‌کند تا هر کس در هنگام باز کردن سند HTMl شما متوجه نقش هر بخش از کد نویسی شما بشود، به مثال زیر توجه کنید:

<Html dir="rtl">
<!-- right to left -->
سلام، من یک برنامه نویس HTML هستم.
</html>

[ویرایش] تگ عنوان

تگ عنوان یا Head اطلاعاتی را در مورد سند بر روی مرورگر مشخص می‌کند، این تگ فقط یکبار در سند استفاده می‌شود. در این تگ می‌توان تگ‌های مختلفی از جمله Title را استفاده نمود که عنوان سند را مشخص می‌کند. به مثال زیر توجه کنید:

<Html>
<head>
<title>Your text</title>
</head>
</html>
توجه۱:عنصر Title یک عنصر درون خطی است. عناصر درون خطی عناصری هستند که درون آن‌ها فقط می‌توان از عناصر درون خطی دیگر استفاده نمود و عناصر بلوکی عناصری هستند که درون آن‌ها مي‌توان از عناصر درون خطی استفاده نمود.
توجه۲: اگر تگ پایانی Title را بعد از تگ پایانی head قرار می‌دادیم، مجاز نبوده و به این اتفاق عناصر تو در تو مي‌گوییم. به طور کلی عناصر باید دارای تگ شروع و پایان باشند و عنصر که فقط تگ شروع یا پایان داشته باشد مجاز نیست.

[ویرایش] تگ بدنه

تگ بدنه یا Body همیشه بعد از عنوان قرار می‌گیرد و مانند عنوان فقط یکبار مجاز به استفاده از آن هستیم، همچنین شایان ذکر است که استفاده از تگ بدنه الزامی بوده ولی استفاده از تگ عنوان دلبخواهی است. درون تگ بدنه هر آنچه که در صفحه قرار است نمایش داده شود نوشته می‌شود. به مثال زیر توجه کنید:


<Html dir="rtl">
<head>
<title>Your text</title>
</head>
<body>
هر آنچه اینجا قرار گیرد در صفحه یا همان بدنه سایت نمایش داده می‌شود.
</body>
</html>
نکته: تگ بدنه یک عنصر بلوکی می‌باشد.

همانطور که می‌دانید استفاده از متون خالی در صفحات چندان جذاب و منظم نمی‌باشد،‌ بنابر این صفحات را باید هر چه بهتر کاربر پسند و مرتب کنیم، برای اینکار تگ‌های صفحه آرایی را مورد بررسی قرار مي‌دهیم.