دانلود مقاله یادگیری اچ تی ام ال HTML

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

2- شما به یک ویرایشگر متن نیاز دارید.

در ویندوز شما می توانید از برنامه Notepad استفاده کنید.

از هر نرم افزار ویرایش متن دیگری استفاده کنید اما این نکته را در نظر داشته باشید که نرم افزار WordPad که در ویندوز وجود دارد و نرم افزارهایی مانند Microsoft Office و امثال آن برای نوشتن کدهای HTML مناسب نیستند چون در هنگام ذخیره کردن متن این نرم افزارها کدهایی را به آن اضافه می کنند.
نرم افزار Notepad را می توانید از طریق منوی استارت در قسمت Accessories پیدا کنید یا از طریق فرمان Run با تایپ notepad در کادر Open و فشار دادن دکمه Enter.

3- شما به یک مرورگر وب به انتخاب خود نیاز دارید.

می توانید از Microsoft Internet Explorer استفاده کنید که با ویندوز نصب می شود یا از Opera, Mozilla Firefox و نرم افزارهای مشابه که اغلب به صورت رایگان برای دانلود در اینترنت وجود دارند.
بهتر است برای اینکه بتوانید صفحه خود را با اینترنت اکسپلورر و نت اسکیپ امتحان کنید، از هر دو مرورگر مختلف که هر کدام بر پایهء یکی از دو مرورگر ذکر شده باشند استفاده کنید.

4- شما به جایی برای ذخیره کردن متن خود دارید که می تواند جایی روی هارد دیسک شما، یک فلاپی دیسک یا یک سرور باشد.

البته شما برای استفاده از HTML نیاز ندارید حتماً به اینترنت متصل باشید، شما می توانید با استفاده از یک مرورگر وب در کامپیوتر خود از HTML استفاده کنید.

برای ذخیره کردن فایلی که با Notepad نوشته اید کافی است از منوی File گزینه Save As را انتخاب کرده و مسیری را برای ذخیره فایل انتخاب کنید و در کادر File Name در پایین پنجره Save As نام فایل را با پسوند html بنویسید.

در آخر هم دکمه Save را کلیک کنید.
در اینجا می خواهیم به ساختار شناسه ها یا همان تگها (tag) در HTML بپردازیم.

یک تگ همیشه با علامت کوچکتر ریاضی یعنی این علامت > آغاز می شود و با علامت بزرگتر < به="" پایان="" می="" رسد.="" مثلاً="" تگی="" که="" باعث="" ایجاد="" زیرخط="" کلمات="" می="" شود="" اینطور="" نوشته="" می="" شود:="" این="" علامت="" را="" قبل="" از="" متنی="" که="" می="" خواهیم="" زیر="" آن="" خط="" کشیده="" شود="" قرار="" می="" دهیم.="" به="" این="" تگ="" ،="" تگ="" ابتدایی="" (opening="" tag)="" می="" گویند،="" که="" عملیاتی="" را="" که="" شما="" می="" خواهید="" آغاز="" کنید="" شروع="" می="" کند.="" به="" منظور="" پایان="" دادن="" به="" زیرخط="" باید="" از="" یک="" تگ="" پایانی="" استفاده="" کنید.="" یک="" تگ="" پایانی="" با="" این="" علامت="" شروع="" می="" شود:=""> بقیه تگ مانند تگ ابتدایی می باشد.

برای درک بهتر این مطلب به مثال زیر توجه کنید:
Tags and their position
اگر بخواهید متن بالا را با زیرخط در مرورگر خود ببینید باید آنرا مطابق خط روبرو در ویرایشگر متن خود بنویسید:

Tags and their position
نتیجه را به این صورت می بینید:
Tags and their position
همه تگها به یک تگ پایانی نیاز ندارند.

برای مثال تگی که برای وارد کردن عکس استفاده می شود از این قبیل تگهاست، که به این صورت می باشد:

البته بعداً در مورد این تگ توضیح خواهیم داد در اینجا فقط برای مثال این تگ را آوردیم.

موارد دیگری هم با این وضعیت وجود دارند مثلاً:
که برای رفتن به خط بعدی استفاده می شود،

که برای ایجاد یک خط افقی به کار می رود و
که برای رفتن به پاراگراف بعدی استفاده می شود.

البته بعداً در مورد این تگ توضیح خواهیم داد در اینجا فقط برای مثال این تگ را آوردیم.

موارد دیگری هم با این وضعیت وجود دارند مثلاً: که برای رفتن به خط بعدی استفاده می شود، که برای ایجاد یک خط افقی به کار می رود و که برای رفتن به پاراگراف بعدی استفاده می شود.

در ضمن نیاز نیست که حتماً تگها با حروف بزرگ نوشته شوند.

مثلاً همان است.

البته در نسخه های جدیدتر HTML توصیه می شود کدهای HTML با حروف کوچک نوشته در XHTML هم نوشتن کدها با حروف کوچک الزامی است.

فضای خالی هم بین تگها تأثیری ندارد.

مثلاً : متن زیرخط دار کد بالا همان نتیجه ای را می دهد که کد زیر دارد: متن زیرخط دار به این طریق هم اگر نوشته شود فرقی نمی کند: متن زیرخط دار قالب پایه ای یک فایل HTML مانند زیر است.

ببینید می توانید کاری را که تگهای این کد انجام می دهند حدس بزنید؟

البته همه آنها را بعداً توضیح می دهیم.

html قالب اصلی هر چیزی که اینجا قرار گیرد در صفحه شما قابل دیدن است برای درک بهتر این قسمت سعی کنید تگها را به صورت جفتی در نظر بگیرید (از جایی که باز می شوند تا جایی که بسته می شوند) اولین تگ است که علامت شروع یک متن HTML است و تگ پایانی آن است که همانطور که ممکن است حدس زده باشید نشانه پایان متن HTML است.

هر چیزی در HTML باید بین این دو تگ قرار گیرد.

مانند متن، دیگر تگها، عکسها و...

چون این دو تگ نشان دهنده آغاز و پایان صفحه شما هستند.

تگ بعدی است.

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

این بخش با به پایان می رسد.

در مثال بالا تنها قسمت HEAD عنوان صفحه بود که با TITLE مشخص می شود.

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

این قسمت مورد استفاده موتورهای جستجو قرار می گیرد و همان متنی است که به هنگام مشاهده صفحه در نوار عنوان مرورگر نشان داده می شود.

تا هنگامی که این تگ در قسمت BODY قرار نگیرد در متن شما نشان داده نمی شود.

برای پایان دادن به تگ عنوان از این تگ استفاده می شود: در مثال بالا عنوانی که برای صفحه نشان داده می شود قالب اصلی HTML است.

تگ بخشی را آغاز می کند که در صفحه مرورگر شما به نمایش در می آید.

این قسمت جایی است که ما باید کار اصلی خود را در آن انجام دهیم.

برای پایان دادن به این تگ از استفاده می کنیم.

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

در درس در این درس به کار با متنها می پردازیم.

ابتدا با این تگ شروع می کنیم: 1- این تگ باعث می شود کلماتی که بین این تگ و تگ پایانی آن قرار دارند به صورت پر رنگ و بولد (Bold) دیده شوند.

به مثال زیر توجه کنید: متنی که اینجا قرار بگیرد به صورت بولد نمایش داده می شود مثال بالا به صورت زیر دیده می شود: متنی که اینجا قرار بگیرد به صورت بولد نمایش داده می شود بیایید با تگهای دیگری ادامه دهیم: 2- زیرخط (Underline): این متن با زیر خط مشاهده می شود این هم نتیجه: این متن با زیر خط مشاهده می شود 3- حروف کج (Italic): این متن به صورت مورب دیده می شود و نتیجه به این صورت است: این متن به صورت مورب دیده می شود 4- حروف خط خورده: این متن به صورت خط خورده دیده می شود متن در مرورگر به این صورت دیده می شود: این متن به صورت خط خورده دیده می شود 5- وسط چین: این متن در وسط خط نوشته می شود نتیجه کد: این متن در وسط خط نوشته می شود شما می توانید بیشتر از یک فرمان را برای یک متن اجرا کنید.

مثلاً وقتی که می خواهید متنی به صورت پر رنگ و کج نوشته شود.

برای این کار هر دو تگ ابتدایی را برای متن در ابتدای آن و تگهای پایانی را در جایی که می خواهیم پایان پر رنگی و کجی متن باشد قرار می دهیم.

با این مثال توجه کنید: این متن به صورت کج و پر رنگ دیده می شود نتیجه هم به این صورت دیده می شود: این متن به صورت کج و پر رنگ دیده می شود آیا ترتیب قرار گرفتن تگهای پایانی مهم است؟

در پاسخ باید گفت در مثال بالا خیر، اما مواردی وجود دارد که ترتیب قرار گرفتن تگها مهم است مثلاً قرار گرفتن تگ پایانی قبل از اشتباه است.

شما با تمرین و تجربه می توانید این نکته را فرا بگیرید.

شما می توانید برای جلو گیر از اشتباه HTML را به صورت زیر بنویسید: این متن به صورت پر رنگ و کج دیده می شود اما این روش خسته کننده است.

در اینجا مهم نیست تگها به چه صورت باز و بسته شوند.

اما نکته مهمی که باید در نظر داشته باشید این است که متنها تحت تأثیر تگهایی که قبل از آنها باز شدهاند و بسته نشده اند قرار می گیرند.

تأثیر یک تگ تمام می شود وقتی که تگ بسته شود.

مثال زیر را در نظر داشته باشید: این متن پر رنگ، کج و دارای زیرخط است این نتیجه را به ما می دهد: این متن پر رنگ، کج و دارای زیرخط است اما این یکی: این متن پر رنگ، کج و دارایزیرخط است این نتیجه را به ما می دهد: این متن پر رنگ، کج و دارایزیرخط است همان طور که دیدید متن بولد و ایتالیک زودتر از متن زیرخط دار به پایان رسید و این به این دلیل است که تگهای پایانی بولد ()و ایتالیک () زود تر نوشته شدند و انتهای متن فقط توسط تگ زیرخط () تحت تأثیر قرار دارد.

متنها به صورت پیش فرض در سمت چپ صفحه به نمایش در می آیند.

اما با استفاده از می توان آنها را در وسط صفحه به نمایش در آورد.

این تگ را هم می توان با دیگر تگها ترکیب کرد و نتایج جابی گرفت.

به مثال زیر توجه کنید: به این مثال توجه کنید در این قسمت از درس به سراغ کار با فونتها و اندازه آنها می رویم.

اندازه فونت را می توان با دستور زیر تعیین کرد: متنی که می خواهیم اندازه آنرا تعیین کنیم به جای «x» عددی با علامت منفی یا مثبت قرار می گیرد.

وقتی که می خواهیم یک متن بزرگتر دیده شود از علامت مثبت و زمانی که می خواهیم متن کوچکتر شود از علامت منفی استفاده می کنیم.

به مثال زیر توجه کنید: این متن بزرگتر دیده می شود این هم نتیجه تغییر سایز فونت: این متن بزرگتر دیده می شود برای کوچکتر کردن متن نیز به همین صورت عمل می کنیم: این متن کوچکتر دیده می شود این هم متن کوچک شده: این متن کوچکتر دیده می شود این هم تعدادی مثال برای درک بهتر مطالب: این متن با اندازه 4 نوشته شده است این متن با اندازه 4 نوشته شده است این متن با اندازه 3 نوشته شده است این متن با اندازه 3 نوشته شده است این متن با اندازه 2 نوشته شده است این متن با اندازه 2 نوشته شده است این متن با اندازه 1 نوشته شده است این متن با اندازه 1 نوشته شده است این متن با اندازه 1- نوشته شده است این متن با اندازه 1- نوشته شده است این متن با اندازه 2- نوشته شده است این متن با اندازه 2- نوشته شده است این متن با اندازه 3- نوشته شده است این متن با اندازه 3- نوشته شده است برای تغییر رنگ متنها نیز می توانیم به روش زیر عمل کنیم، با این فرمان : می توانیم رنگ مورد نظر خود را با نام انگلیسی آن در فرمان بالا قرار دهیم یا از معادل هگزا دسیمال رنگ به جای اسم رنگ استفاده کنیم.

برای شروع با اسم رنگ شروع می کنیم: متن مورد نظر متن نهایی: متن مورد نظر حالا از معادل هگزا دسیمال رنگ قرمز به جای نام رنگ استفاده می کنیم.

البته استفاده از اسم رنگها ساده تر است اما شما ممکن است بخواهید از رنگهای پیچیده تری استفاده کنید.در مورد رنگ قرمز باید به این صورت عمل کنیم: متن مورد نظر در اینجا نتیجه با مثال قبلی یکسان است: متن مورد نظر معادل هگزا دسیمال رنگها را باید با علامت # شروع کرد و بعد از این علامت شش حرف یا عدد دیگر قرار می گیرد.

برای رنگ قرمز بعد از علامت # دو F و چهار صفر قرار می گیرد.

اگر می خواهید معادل هگزادسیمال رنگها را به دست آورید اینجا را کلیک کنید.

فرض کنید می خواهید رنگ و اندازه متنی را همراه با هم تغییر دهید.

برای این کار می توانید از دو تگ FONT استفاده کنید.

اما به خاطر داشته باشید که هر دو را ببندید.

مانند زیر: متن بزرگ و طلایی متن بزرگ و طلایی همچنین می توانید از اعلانهای SIZE و COLOR در یک تگ FONT استفاده کنید.

مانند زیر: متن بزرگ و طلایی متن بزرگ و طلایی شما می توانید رنگ فونت را در تگ BODY تعریف کنید که بعداً به آن می پردازیم.

آیا تا به حال موقعیتی پیش آمده که بخواهید بین دو کلمه فاصله بیشتری وجود داشته باشد.

یا بخواهید علامت کپی رایت را نشان دهید.

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

این کدهای ویژه با علامت & (امپرسند) شروع می شوند و با تعدادی حرف یا عدد ادامه پیدا می کنند و با ; (نقطه ویرگول) پایان می یابند.

برای مثل زمانی که شما می خواهید بین دو کلمه فضای خالی اضافی بگذارید باید از کد ;nbsp& استفاده کنید که فضای خالی اضافه می کند.

مطابق مثال زیر: کلمه اول   کلمه دوم نتیجه به این صورت خواهد بود: کلمه اول کلمه دوم فاصله اول بین کلمات با فشار دادن دکمه Space ایجاد می شود.

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

افزودن کد ;nbsp& مرورگر را مجبور می کند تا بین دو کلمه فاصله اضافی بگذارد.

شما با تکرار این کد می توانید به هر تعداد که بخواهید فاصله خالی ایجاد کنید.مانند زیر: کلمه اول     کلمه دوم نتیجه: کلمه اول کلمه دوم این فرمان چهار فضای خالی اضافی بین دو کلمه ایجاد می کند.

و در مجموع پنج فضای خالی داریم.

بحث بعدی ما علامت کپی رایت است.

شما می توانید به همان روشی که برای فضای خالی اضافی ایجاد کردیم این علامت را نیز به وجود بیاورید.

یعنی با استفاده از کد آن.

کد علامت کپی رایت این است: ;copy& به این مثال توجه کنید: this page Copyright © 2006 by me متن نتیجه: this page Copyright © 2007 by me روش کار برای تمامی کاراکترهای ویژه به همین صورت است فقط کد آنها را در متن HTML قرار دهید.

در جدول زیر می توانید تعدادی از این کاراکترهای ویژه را به همراه کد سازنده آنها ببینید: در این بخش ایجاد لینک به بقیه صفحات را مورد بررسی قرار می دهیم.

برای ایجاد لینک از تگ زیر استفاده می کنیم: متن لینک نشانه لینک است، ""=HREF مشخص کننده آدرس لینک می باشد، نشانه بسته شدن تگ است.

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

مثلاً اگر می خواهید به یک صفحه وب مثلاً صفحه اصلی سایت ما با این آدرس: http://www.neopersia.org/HTML/index.php لینکی را در صفحه خود داشته باشید باید فرمان زیر را در قسمت body صفحه خود در جایی که می خواهید لینک به نمایش درآید قرار دهید: متن نمونه برای لینک لینک در صفحه شما به این صورت دیده می شود: متن نمونه برای لینک لینکی را که با فرمان بالا ساخته اید به صورت رنگی (بسته به تنظیمات مرورگر رنگ آن تعیین می شود) و زیرخط دار به وجود می آید.

که این خصوصیات نشانه آن است که یک متن لینک است و وقتی که نشانگر ماوس را بر روی آن قرار دهید به شکل دست در می آید.

البته هر متنی که رنگی بود و دارای زیر خط بود لزوماً نباید یک لینک باشد.

شکل نشانگر ماوس در اینجا به کمک ما می آید.

اگر شما لینکی را که با این روش به وجود آمده کلیک کنید به صفحه مورد نظر می روید.

با این روش شما می توانید به هر صفحه ای لینک بسازید چون آدرس کامل آنرا در لینک قرار داده اید.

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

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

در مثال زیر فرض بر این است که هر دو صفحه مبدأ و مقصد لینک در یک پوشه قرار دارند.

برای نمونه سرفصل آموزش مقدماتی HTML در همان پوشه ای قرار دارد که این صفحه قرار دارد.

نام این صفحه index.php است.

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

اگر شما شک دارید یا مطمئن نیستید که هر دو صفحه در یک پوشه قرار دارند حتماً از آدرس کامل استفاده کنید.

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

شناسه دیگری که می توانید در تگ لینک به کار ببرید title است.

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

به مثال زیر توجه کنید: آموزش CSS به زبان فارسی ماوس خود را روی لینک زیر قرار دهید تا نتیجه را مشاهده کنید: آموزش CSS به زبان فارسی از شناسه های دیگری نیز در تگ لینک می توان استفاده کرد که نحوه نمایش لینک در صفحه را تعیین می کنند.

برای اطلاعات بیشتر صفحه باز کردن لینک در پنجره جدید را مطالعه کنید.

آیا شما می خواهید یک عکس را به صفحه خود اضافه کنید؟

برای این کار باید از تگ زیر استفاده کنید: در این تگ IMG نشانه قرار گرفتن تصویر در صفحه و SRC آدرس محل قرار گرفتن فایل عکس است.

حتماً لازم نیست این عکس مربوط به سایت شما باشد یا در سرور شما قرار داشته باشد، شما می توانید هر عکسی که در اینترنت قابل دسترسی باشد استفاده کنید (اگر قصد دارید صفحه خود را در یک سایت اینترنتی قرار دهید) .

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

مثلاً اگر عکس شما در این آدرس قرار دارد http://www.Example.com/images/image.gif و صفحه ای که در حال ویرایش آن هستید در پوشه ای غیر از این قرار دارد شما باید تگ زیر را برای اضافه کردن عکس به صفحه خود به کار ببرید: اگر فایل html و عکس هر دو در یک پوشه باشند می توانید برای راحتی در تایپ کردن از این تگ استفاده کنید: پسوند فایل حتماً نباید gif.

باشد.

یعنی شما می توانید از فرمتی مثل jpg.

نیز استفاده کنید.

این دو فرمت از بقیه پر استفاده تر هستند.

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

برای نمونه من می خواهم یک عکس را با نام LEARN_HTML.gif را که در پوشه همین صفحه قرار دارد را به این صفحه اضافه کنم.

در اینجا از این تگ استفاده کرده ام: با نوشتن این تگ، این تصور را در صفحه نهایی می بینیم: به این ترتیب یک تصویر را در سمت چپ صفحه خواهیم دید (در صورتی که صفحه ما چپ به راست باشد).

اگر می خواهید تصویر در مرکز صفحه ( وسط خط ) قرار گیرد باید از تگ در اطراف تگ تصویر استفاده کنید.

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

مثلاً می توان از تگ با شناسه "align="center استفاده کرد.

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

پس ممکن است اگر به جای image.jpg از IMAGE.JPG استفاده کنید ممکن است مرورگر شما عکسی را در صفحه نشان ندهد.

پس در نوشتن آنها دقت کنید.

در مورد اضافه کردن عکسها به صفحه بعداً با جزئیات بیشتری توضیح می دهیم.

تا اینجا یاد گرفتیم چگونه یک عکس را به صفحه اضافه کنیم و نحوه قرار گیری آنرا در صفحه تعیین کنیم.

تعدادی تگ وجود دارد که در هنگام کار با متن ها می توانید از آنها کمک بگیرید.

تگهایی که در این قسمت مورد بحث قرار می گیرند اینها هستند: , , , , 1- و این دو تگ بیشتر در زمانی استفاده می شوند که شما می خواهید در صفحه خود معادلات ریاضی را به نمایش در آورید اما ممکن است شما برای چیزهای دیگری هم از آنها استفاده کنید.

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

مانند این: استفاده از تگ : y1 نتیجه به این صورت دیده می شود.از این تگ می توان برای گذاشتن اندیس برای کلمات استفاده کرد.

y1 استفاده از تگ : 253 از این روش می توانید برای گذاشتن توان برای اعداد استفاده کنید.

نتیجه به این صورت خواهد بود: 253 2- از این تگ زمانی استفاده می شود که شما بخواهید همان مقدار فضای خالی که در ویرایشگر متن خود در متن HTML دارید در صفحه نهایی خود نیز داشته باشید.

مثلاً وقتی که متنی را در مورد برنامه نویسی در صفحه خود می نویسید.

به این مثال توجه کنید: x=1; y=2; if (x==1) y=2; نتیجه به این صورت ملاحظه می شود: x=1; y=2; if (x==1) y=2; در هنگام استفاده از این تگ شما نیازی به استفاده از و ;nbsp& ندارید و راحت می توانید متن خود را به همانگونه که می خواهید به نمایش در آید بنویسید.

3- و هر متنی که بین و قرار گیرد تا وقتی که شما به خط بعدی نروید نمی شکند و در یک خط نمایش داده می شود حتی بعد از رسیدن به پایان خط در صفحه.

به این مثال توجه کنید: مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال نتیجه به این صورت نمایش داده می شود: مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال احتمالا شما برای دیدن تمام متن باید از نوار لغزنده پایین صفحه استفاده کنید.

شما می توانید از تگ در تگ بالا استفاده کنید اگر می خواهید بیش از یک خط متن بلند داشته باشید.

به مثال زیر توجه کنید: ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال این هم نتیجه: ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال ، مثال 4- با استفاده از این تگ می توانید متنی را به صورت چشمک زن در آورید.

این تگ فقط در مرورگرهایی کارایی دارد که بر پایه Netscape ساخته شده باشند.

Opera و Firefox از جمله مرورگرهایی هستند که می توانند این تگ را نمایش دهند.

درMicrosoft Internet Explorer فقط متن ساده را می توان مشاهده کرد.

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

برای کارایی بیشتر می توانید آنرا با اندازه فونتی مثل 10+ استفاده کنید.

به این مثال توجه کنید: this is VERY VERY important!!!

نتیجه این تگ: this is VERY VERY important!!!

توضیحات ( کامنتها ) می توانند وقتی که در حال نوشتن صفحه خود هستید به شما کمک کنند.

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

تنها راه مشاهده کامنتها مشاهده صفحه Source code صفحه است که با زبان HTML نمایش داده شود.

با استفاده از این خاصیت شما می توانید در هنگام نوشتن یک صفحه برای خود یادداشت بگذارید تا وقتی که بعداً به آن نگاه کردید بهتر آرا درک کنید.

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

برای نوشتن یک کامنت شما باید ابتدا این علامت > سپس علامت تعجب !

و بعد دو خط فاصله -- (دش) بگذارید.

بعد از این علائم هر متنی که بنویسید توسط مرورگر نمایش داده نمی شود.

تا وقتی که علامت پایان کامنت را در انتهای آن بگذارید.

علامت پایان کامنت به این صورت نوشته می شود: ابتدا دو خط فاصله -- سپس این علامت شما می توانید کامنتها را در چندین خط بنویسید فقط به خاطر داشته باشید که علامت انتهایی را در آخر آن قرار دهید.

مانند زیر: آیا می خواهید یک لیست را به صفحه خود اضافه کنید؟

در اینجا راههایی برای افزودن یک لیست HTML به یک صفحه آورده شده است.

برای شروع نیاز به تگهای ابتدایی و انتهایی لیست داریم.

در ابتدا با یک لیست نامرتب شروع می کنیم.

این تگ یک لیست بولت دار را به وجود می آورد.

تگ ابتدای آن است و تگ پایانی آن است.

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

در زیر یک مثال برای این نوع لیست آورده شده است: بخش اول لیست بخش دوم لیست بخش سوم لیست مثال بالا یک لیست بولت دار با سه بخش را به ما می دهد: بخش اول لیست بخش دوم لیست بخش سوم لیست به این نکته هم توجه کنید که نیازی به تگ پایانی ندارد ولی بهتر اس از تگ پایانی آن یعنی استفاده شود..

فاصله متن لیست شده از ابتدای خط هم مقداری از بقیه متن بیشتر می شود.

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

چون ممکن است تمام سطرهای متن شما به یک اندازه نباشند.

در این صورت به جای اینکه لیستی در یک خط و مستقیم داشته باشید ممکن است لیستی در هم ریخته و شلوغ به وجود آید.

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

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

راه دیگری که برای جلوگیری از این به هم خوردگی وجود دارد استفاده از یک Table است که بعداً در مورد آن توضیح خواهیم داد.

شما می توانید در مورد لیستهای مرتب هم مانند لیستهای نامرتب عمل کنید ولی به جای استفاده از و از تگهای و استفاده کنید.

به یک مثال در این زمینه توجه کنید: بخش اول لیست بخش دوم لیست بخش سوم لیست نتیجه به صورت لیستی شماره گذاری شده ظاهر می شود: بخش اول لیست بخش دوم لیست بخش سوم لیست همچنین در مورد لیستهای مرتب با استفاده از شناسه start در تگ می توانیم تعیین کنیم که شماره های لیست از چه عددی شروع شود.

به مثال زیر توجه کنید: این سطر اول لیست است ولی شماره آن 15 است.

نتیجه به صورت زیر مشاهده می شود: این سطر اول لیست است ولی شماره آن 15 است.

وقتی که شما یک صفحه HTML می نویسید می توانید چیزهای زیادی را در آن با اضافه کردن شناسه هایی به تگ تغییر داد.

تگ زیر را در نظر بگیرید: شما می توانید به هر تعداد از این شناسه ها که خواستید به این تگ اضافه کنید.

اگر از شناسه ای استفاده نکنید این گزینه مطابق پیش فرض مرورگر تنظیم می شود.

در زیر توضیحی برای هر کدام از شناسه های تگ BODY آورده شده است.

البته در مورد هر کدام از آنها به طور کامل در درسهای بعد توضیح خواهیم داد: