تگ ها ( tags ) اجزا تشکیل دهنده عناصر یا elements های اچتمل هستند .عناصر و تگ های پایه و مهم:

,
, .... , ,


یکی از بهترین روش های یادگیری تگ های اچتمل دیدن مثالها و تغییر آنها میباشد و با کمک ادیتور اختصاصی ما و با استفاده از امکانات فارسی نویسی آن به صورت آنلاین میتوانید به مطالعه و یادگیری مثالها پرداخته، کدهای اچتمل را تغییر داده و با کلیک روی دکمه "نمایش نتایج" به مشاهده نتایج بپردازید.

● مثالها :
▪ مثالی ساده از یک صفحه اچتمل
در این مثال بسیار ساده جمله "!Hellow World" در صفحه مرور گر نمایش داده میشود و در واقع محتوا و متن عنصر body تماما نمایش داده خواهد شد.
▪ پاراگرافهای ساده:
چگونگی نمایش متون با کمک تگ

و بصورت پاراگرافی
▪ نمایش متون فارسی:
چگونگی نمایش متون فارسی. برای جزئیات بیشتر به فصل فارسی نویسی مراجعه کنید.

● سر تیترها (Headings)
سر تیترها با کمک تگ های تا تعیین میشوند. معرف بزرگترین سر تیتر و معرف کوچکترین سر تیتر است. مرورگر به هنگام نمایش یک سر تیتر بصورت اتوماتیک یک سطر خالی قبل و بعد از هر سر تیتر اضافه خواهد کرد.
This is a heading
This is a heading
This is a heading
This is a heading
This is a heading
This is a heading

مثال بالا در صفحه مرورگر بدین شکل نمایش داده خواهد شد.

● پاراگرافها (Paragraphs)
پاراگرافها با کمک تگ

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

This is a paragraph


This is another paragraph


مثال بالا در صفحه مرورگر بدین شکل نمایش داده خواهد شد.

● سطر جدید (Line Breaks)
برای رفتن سر سطر جدید از تگ
استفاده میشود.در اینحالت یک پاراگراف جدید ایجاد نمیشود. تگ
از نوع تگ های خالی بوده و دارای تگ انتهائی (مثلا
) نمیباشد.

This
is a para
graph with line breaks


مثال بالا در صفحه مرورگر بدین شکل نمایش داده خواهد شد.

● کامنت ها در اچتمل (Comments)
برای نوشتن شرح و توضیحات در مورد کدهای اچتمل باید از تگ خاصی استفاده کنید. برای اینکار باید متن و شرحتان را درون علائم <-- و --!> قرار دهید. مرور تگ های comment را در نظر نگرفته و محتوی آنها را نمایش نخواهد داد و فقط شرح و توضیحات برای برنامه نویس و دیگر افرادی که احتمالا در آینده با کد اچتمل کار خواهند کرد مفید خواهد بود. (به محل نویسه "!" توجه کنید! فقط یکی و آنهم در ابتدا)


● مثالی در مورد comments و نحوه استفاده از آن
▪ چند نکته کاربردی:
توجه داشته باشید که بدلیل وجود مرورگرهای متفاوت (اکسپلورر، نت اسکیپ، ..) و به دلیل تفاوت دقت نمایش صفحه نمایش کامپیوترها، صفحات اچتمل با اندکی تفاوت در حالتهای مختلف نمایش داده میشوند و همیشه سعی کنید که صفحاتتان را نه تنها با اکسپلورر که معروفترین مرورگر است بلکه با نت اسکیپ و حتی مرورگرهای کامپیوترهای مکینتاش چک کرده و همچنین در دقت های نمایش ۸۰۰x۶۰۰ و ۱۰۲۴X۷۶۸ آن را امتحان کنید.
از نظر فاصله و سطر بندی، متنی که در صفحه ادیتورتان تایپ میکنید با چیزی که مرورگر نمایش خواهد داد متفاوت خواهد بود.همیشه به یاد داشته باشید که فاصله های اضافی (space) و خطهای خالی متن در صفحه ادیتور توسط مرورگر در نظر گرفته نشده و نمایش داده نخواهد شد.
برای نمایش بیش از یک فاصله خالی باید از نویسها یا ترکیب کاراکتری خاصی (None Breaking Space) استفاده کنید. در بخش ( Entities ) نهادها به این مطلب بیشتر پرداخته خواهد شد.
فاصله های اضافی بین کلمات در یک متن اچتمل توسط مرورگرها دیده نخواهد شد و در نمایش همیشه تبدیل به یک فاصله (space) خواهد شد. در ضمن یک خط خالی در متن ادیتور بصورت یک فاصله یا space نمایش داده خواهد شد.
برای ایجاد یک سطر جدید هیچگاه از یک تگ

خالی استفاده نکنید و به جای آن از تگ
استفاده کنید..
مرورگرها به هنگام نمایش بعضی عناصر بصورت اتوماتیک یک سطر خالی قبل و بعد از آن عنصر نمایش خواهند داد. برای نمونه این گروه از عنصرها میتوان از پاراگراف (

) و سرتیترها () نام برد.
تگ


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

● پاراگرافها
این مثال بعضی از مقادیر قراردادی عناصر پاراگراف را شرح میدهد.

● ترازبندی پاراگراف ها
این مثال نحوه تراز بندی یک پاراگراف را با کمک شناسه یا attribute ای به نام align نشان میدهد. در این حالت پاراگراف در وسط ناحیه نمایش داده خواهد شد.
( "align="center )
رفتن سر سطر جدید
این مثال نحوه استفاده از تگ
را در یک متن اچتمل نشان میدهد.

● سر تیترها
این مثال نحوه استفاده از تگهای .... را در یک متن اچتمل نشان میدهد.

● ترازبندی سر تیترها
این مثال نحوه تراز بندی یک سر تیتر را با کمک شناسه یا attribute ای به نام align نشان میدهد. در این حالت سر تیتر در وسط ناحیه نمایش داده خواهد شد.
( "align="center )

● نمایش خطوط افقی
این مثال نحوه نمایش خطوط افقی با استفاده از تگ
میباشد.

● استفاده از comment
این مثال نحوه استفاده از comment در کدهای اچتمل را نمایش میدهد.

● تعیین رنگ زمینه صفحه
این مثال نحوه تعیین رنگ زمینه صفحه را با کمک یکی از شناسه های (attribute ) عنصر body با نام bgcolor نشان میدهد. (Background Color)
( "bgcolor ="blue )

Iran Developers