مختصری در مورد کدهای HTML لطفا قبل از باز کردن کلیه پاورپوینت ها فونت های پیوست را نصب نمایید

مختصری در مورد کدهای HTML

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

www.Ashora.blogfa.com

منظور از وب چيست؟

وب شبکه ای است متشکل از تمامی کامپيوترهای دنيا، شبکه ای از شبکه ها.

همگی يک چيزند. World Wide Web يا WWW ، webاينترنت، وب،

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

با هم HTTPکامپيوترهای موجود در وب با کمک استاندارد ارتباطی يا پروتوکل

ارتباط برقرار مي کنند .

نحوه کارکرد وب چگونه است؟

و يا صفحات وب قرار دارند. Web Pagesاطالعات وب داخل فايلهائی به نام

يا کامپيوترهای سرويس دهنده وب Web Serverاين فايلها يا صفحات روی

ذخيره شده اند.

Web Browserبرای ديدن صفحات وب از نرم افزاری به نام مرورگر و يا

استفاده مي شود.

جزو معروفترين Netscape Navigator و Internet Explorerدو مرورگر

مرورگرها حساب مي شوند.

متعلق به شرکت مايکروسافت و مرورگر Internet Explorerمرورگر

Netscape Navigator .متعلق به شرکت نت اسکيپ مي باشد

مرورگرها چگونه به خواندن صفحات وب مي پردازند؟

درخواسeتی بeرای خوانeدن يeک صeفحه از وب Requestيک مرورگeر بeا کمeک يeک

سرور مي کند.

HTTP يeا درخواسeت بeر اسeاس اسeتاندارد ارتبeاطی يeا پروتوکeل Requestاين

بوده و شامل آدرس صفحه مورد نظر مي باشد.

http://www.khaterat.com/faq.htmlآدرس يeک صeفحه وب چeيزی شeبيه

نeوع پروتوکeل و يeا اسeتاندارد ارتبeاطی را تعeيين مي کنeد، httpاسeت. بخش //:

www.khaterat.com اeي دومين نeام Domain و اسeت faq.html امeن

صفحه ای است که بايد خوانده شود.

مرورگرها چگونه صفحات وب را نمايش مي دهند؟

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

مرورگرها از روی دستورالعملهای داخل صفحات وب و با کمک تگ ها به

نمايش صفحات مي پردازند.

( بيان چگونگی نمايش اطالعات HTML tagsوظيفه اصلی تگ های اچتمل )

مي باشد.

< است. p< اين تگ پاراگراف است! >/pيک تگ اچتمل چيزی شبيه >

چه کسانی استاندارد های وب را تعيين مي کند؟

تعيين استاندارد های وب ربطی به شرکتهای مايکروسافت و يا نت اسکيپ ندارد.

World Wide Web Consortium يا W3C .متولی تعيين استانداردهای وب است

HTML, CSS and XML .از مهمترين استانداردهای تصويب شده وب مي باشند

مي باشد .XHTML 1.0 استاندارد HTMLآخرين استاندارد

چيست؟HTMLيک فايل

•HTML .را "اچ تی ام ال" و يا اچتمل بخوانيد

•HTML برگرفته از حروف اول Hyper Text Markup Language .مي باشد

ها مي باشد. markup tag مي باشد که متشکل از text فايلی از نوع HTMLيک فايل •

ها می فهمد که چگونه بايد صفحه را نمايش markup tag از روی Browserمرورگر يا •

بدهد.

باشد. html و يا htm بايد دارای انشعاب HTMLيک فايل •

مي باشد که با هر اديتور ساده ای قابل ايجاد است. text فايلی از نوع HTMLيک فايل •

( بيان چگونگی نمايش اطالعات مي باشد. markup tagsوظيفه اصلی تگ های اچتمل ) •

HTMLآموزش کدنويسي

Notepad:را اجرا كرده و جمالت زير را بنويسيد

<HTML>

/<HTML>

( ناميده مي شوند.Tagهر كدام از اين جمالت تگ )

اينها تگهاي آغازين وپاياني هستند. براي ایجاد تگ پاياني كافيست يك / به تگ آغازين اضافه كنيم. ولي همه تگها داراي تگ پاياني نیستند . اينطور فكر كنيد كه تگ ها با مرورگر صحبت مي كنند يا به مرورگر دستور مي دهند.

<HTML يعني آغاز سند >html/< و HTML يعني پايان سند. حال بعضي > يك جفت تگ بنام htmlدستورات رابين اينها قرار مي دهيم. هر سند

HEAD: دارد

<HTML>

<HEAD>

/<HEAD>

/<HTML>

� باید در مورد تگهای تنها هستند . TITLE بدان توجه کنیم تگهای HEADچيزي كه فعال قرار ميگيرد عنوان سند را مشخص مي HEAD به شكل زير داخل TITLEتگ

) صفحه شما با این نام باز می شود. (كند :

<HTML>

<HEAD>

<TITLE<>/TITLE>

/<HEAD>

/<HTML>

قرار ميگيرد :BODYو حجم اصلي صفحه داخل تگ

<HTML>

<HEAD>

<TITLE<>/TITLE>

/<HEAD>

<BODY>

/<BODY>

/<HTML>

و در نهايت مي توانيد يك عنوان به سند خود بدهيد و مطالبی داخل بدنه صفحه

, بدون Htmlبنويسيد. بعالوه می توانید نوشته های شخصی خود را در یک سند

اینکه مرورگر آنها را تفسیر نماید , قرار دهید . برای این امر کافی است متن خود

) دقت کنید که فاصله ای بین این عالئم نباشد (را بین عالمتهای >!—و --< بنویسید.

<HTML>

<HEAD>

<TITLE<My Page>/TITLE>

/<HEAD>

<BODY>

This is my first web page!

--!<First lesson >--

/<BODY>

/<HTML >

بلکNه بNه شNکل سNند documentحاال سNند را ذخNيره كنيNد ولی نNه بNه شNكل يNك

html .

انتخNاب كنيNد. در پنجNره اي كNه File را از منNوي Save As بNراي اينكNار فرمNان

نNام سNپس و بسNازيد يNا كنيNد انتخNاب را نظNر مNورد فولNدر شNود مي بNاز

Page1.htm را در بخش File Name ان میNه خودتNامی کNر نNا هNيد ) یNبنويس

را فراموش نکنید. (HTMخواهید , فقط .

)*.*( All Files : ، اطمینNان حاصNل کنیNد کNه Save as type ضNمناn در بخش

را بزنيد.Okرا انتخاب کرده اید و سپس

مي توانيNد بNر روي آيكNون فNايلي كNه ايجNاد كNرده ايNد دوبNار كليNك كنيNد تNا

نتيجه كارتان را ببينيد

قبNل از شNروع درس بعNدی بNه دو نكتNه اشNاره مي كNنيم ، اول اینکNه آنچNه

اسNت کNه حNداقل اطالعNات الزم htmlشNما سNاخته ایNد اسNكلت اصNلي يNك سNند

بNرای یNک سNند وب مي باشNد و کلیNه اسNناد وب بایNد شNامل این عناصNر اصNلی

باشNند . دوم اينكNه عنNوان سNند چNيزي اسNت كNه در نNوار عنNوان پنجNره مرورگNر

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

View source.نحوه قرارگیری و کاربرد این دستورات را مالحظه کنید

به دلیل پاره ای از مسائل گاهی کدهایی که نوشته می شن در وبالگ تغییراتی می کنند و

. لطف کنید کل مطلب HTML 1برخی از عالئم جا به جا می شن , مثل آموزش اول

کپی کنید تا این تغییرات از بین بره. Word کنید و بعد در یک صفحه Selectرو

(Ctrl+c = Copy , Ctrl+v = Paste.موفق باشید )

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

دارد , در این جا یکی از این روش ها را توضیح می دهیم.

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

<H1< >/H1>

<H2< >/H2>

<H3< >/H3>

<H4< >/H4>

<H5< >/H5>

<H6< >/H6>

<H7< >/H7>

ایجاد پاراگراف :ممکن است تصور شود اگر متن خود را پاراگراف بندی کنید و در بین خطوط قرار

دهید در مرورگر هم همان طور نشان داده می شود. اما این طور نیست !

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

< می توان شروع و پایان یک پاراگراف را تعیین کرد. P< و >/P>بوسیله دو دستور < در نظر گرفته شده است.BRرای تعیین خطوط جدید , دستور >

<HTML>

<HEAD>

<TITLE<My Page>/TITLE>

/<HEAD>

<BODY>

<H1<This is my first web page ! >/H1>

<H2< This is my first web page ! >/H2 >

<H3< This is my first web page ! >/H3 >

<H4< This is my first web page ! >/H4>

<P<>H5< This is my first web page ! >/H5<>/P >

<H6< This is my first web page ! >BR< New Line >/H6>

<H7< This is my first web page ! >/H7>

--!<First lesson >--

/<BODY>

/<HTML>

Bold . Italic . UnderLineآراینده های منطقی جهت آرایش کردن متن به صورتی که متفاوت نمایش داده شود , می توان از دستورات زیر

استفاده کرد.BOLD >B<>/B< یا >STRONG<>/STRONG>

<BODY>Qom Computer >B<SoftWare>/B>

/<BODY>ITALIC >I<>/I< یا >EM<>/EM>

<BODY>

Qom >I< Computer >/I< >B<SoftWare>/B>

/<BODY>

UNDERLINE

<BODY>

<U<Qom>/U<>I< Computer>/I<>B<SoftWare>/B>

/<BODY>

ميتوانيم تگهای فوق را به صورت ترکيبی نيز استفاده کنيم:

<BODY>

Qom Computer>I<>B<SoftWare>/B<>/I>

/<BODY>اين مثالی از تگهای تو در تو است.

اگر به اين صورت از تگها استفاده مي کنيد ، مرورگر را دچار سردگمی نکنيد ، اين تگها بايد تو در تو باشند نه اينکه با هم تداخل کنند

اجازه دهيد با مثالی توضيح دهم<THIS<>THAT< >/THIS<>/THATتگهای متداخل بد :>

THIS<>THAT< >/THAT<>/THISتگهای متداخل خوب : >>

سایر آراینده های منطقی :

اگeر می خواهیeد در پایeان نوشeته خeود از کسeی تشeگر کنیeد , بهeتر اسeت از تeگ مقابeل اسeتفاده - 1

کنید :

<CITE<>/CITE>

استفاده شود.ADDRESS بeرای نوشeتن آدرس پسeتی یeا الکeترونیکی افeراد از دسeتور -2

<ADDRESS<[email protected]>/ADDRESS>

به منظور نوشتن کد در صفحات خود از دستور زیر استفاده کنید. -3

<CODE< for ) int I = 0 ; I > 3 ; I++ ( >BR< cout>>"Visual C++"; >/CODE>

اگeر می خواهیeد دربeاره مطلeبی بیش از چنeد سeطر توضeیح دهیeد , بهeتر اسeت از بقیeه متن هeا - 4

ازe دسeتوeر > امeر ایeن eرایeب . eدeکنی اسeتفاده BLOCKQUOTE<>/BLOCKQUOTEجeدeایش >

کنید.

5 - از قeدیمی کامپیوترهeای یeا تeایپ ماشeین بeه صeورت خeود متن گذاشeتن نمeایش بeه جهت

<TT<>/TT.استفاده کنید >

آراینده های فیزیکی

این نeوع آراینeده هeا شeامل رنeگ , نeوع فeونت , سeایز و مeواردی از این قبیeل می باشد

Fontانتخاب >FONT FACE =" نام فونت " <

فeونت را انتخeاب کنیeد , تeا در صeورت عeدم وجeود یکی از فeونت هeا 3می توانیeد به سراغ دیگری برود.

>FONT FACE =" نام فونت , نام فونت , نام فونت " <

نام برخی از فونت ها :

Arial

Arial Black

Comic Sans MS

Courier New

Impact

Times New Roman

Trebuchet MS

Tahoma

Verdana

Sizeانتخاب >FONT SIZE = "یک عدد می باشد" <

انتخاب رنگ متن

>FONT COLOR = "نام رنگ " <

می 16 عالوه بر نام رنگ می توان از یک سیسنم دیگر که در مبنای HTMLدر

نام دارد استفاده کرد ) از فتوشاپ می توان کمک Hexadecimalباشد و

, ... (DE883B# , 3BDE6D# , #ffffff , #000000گرفت ( ) نمونه : به معنای تمام یک رنگ می باشد.ff به معنای هیچ مقدار از آن رنگ و 00در ضمن

رنگ زمینه < قرار می گیردBODYدر همان قسمت >

>BODY bgcolor="نام رنگ یا عدد متناظر با آن " < >/BODY< می باشد.BODYیادتان باشد که مطالب شما بین دو دستور

رسم خطوط افقی و SIZE< استفاده می شود و دو ویژگی HR<>/HRبرای این کار از دستور >

WIDTHضخامت و طول خط ( دارد (>HR WIDTH = "عدد" SIZE = "عدد " <

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

>HR WIDTH="60%" SIZE = 3<

در صفحه وبLinkایجاد – پیوندی به صفحات دیگر وب )از چپ به راست بخوانید(1

>A HREF = "URL رویمeه آن بeردن بeک کeا کلیeواهیم بeه می خeفحه ای کeآدرس صبeرویم دیگeر آدرس صeفحه بeه آن بeر روی کلیeک بeا کeه می خeواهیم متeنی >" >/A<

>A HREF = " http://computerunion.blogfa.com"< انجمن علمی وبالگ >A/< مهندسی کامپیوتر

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

(name.HTM ) – پیوندی به یک قسمت از صفحخ وب موجود2

ابتدا باید برای آن قسمت نامی را قرار داد و سپس به آن لینک کنیم.>A NAME="نام"<>/A<>H1<متن مورد نظر>/H1<>A HREF ="#نام"<متن مورد نظر >/A<

– پیوندی به یک قسمت خاص از یک صفحه وب دیگر 3>A HREF="URL#نام"<متن مورد نظر>/A<

برای متنی قرار داده اید.1نام# نامی است که شما به عنوان مثال در صفحه URL است.1 آدرس صفحه

است.2متن مورد نظر در صفحه فرضی

http://computerunion.blogfa.com/

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

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

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

, www.blogfa.com برای ایجاد یک صفحه وب می توان از

www.persianblog.com.و ... استفاده کرد

www.sheremation.com , www.ripway.com جهت Upload کردن تصاویر

(image & animation .موسیقی و ... می باشد , )

با این مقدمه دستور را ذکر می کنیم :

>IMG SCR = " آدرس تصویر شما در اینترنت"<

>IMG SCR = " آدرس تصویر شما در اینترنت" ALT=" متنی که در صورت عدم

> "ظاهر شدن تصویر نمایش داده می شود

بعالوه می توان طول و عرض تصویر را مشخص کرد

>IMG SCR = " آدرس تصویر در اینترنت " HEIGHT = عدد WIDTH = عدد <

http://www.blogfa.com/

http://www.persianblog.com/

http://www.sheremation.com/

http://www.ripway.com/

قرار دادن تصویر به عنوان لینک :

>A HREF = "آدرس مقصد "<

>IMG SCR = "آدرس تصویر"<

>/A<

صفخات دیگر را ببینید و به Sorceباز هم یادآوری می کنم تا می توانید

گونه ای با آنها بازی کنید تا به خوبی با به کار گیری دستورات آشنا شوید

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

طبقه بندی اطالعات با استفاده ار لیست ها

– لیست های مرتب ) شماره دار (1

– لیست های غیر مرتب ) گلوله دار (2

– لیست های تعریف3

با ترکیب این لیست ها می توان لیست های مرکب و تو در تو ساخت.

– لیست های مرتب ) شماره دار (1در این روش الزم نسeیت مeا خودمeان شeماره هeر عضeو را تعeیین کeنیم . کeافی

< قeرار دهیم. بعeد OL< و >/OL>اسeت محتویeات لیسeت را بین دو دسeتور تعریeف را مشeخص لیسeت انتهeای و ابتeدا این دو دسeتور بeه کمeک آنکeه از کeردیم , نeوبت بeه تعریeف تeک تeک اعضeا می شeود. بایeد در شeروع هeر عضeو

< استفاده کرد.LIجدید از دستور >>OL<>LI<One>LI<Two>LI<Three>LI<Four>/OL<

می تeوان شeماره گeذاری لیسeت هeای مeرتب را از عeدد دیگeری جeز یeک شeروع < استفاده کردOL دستور >STRATکرد. کافی است از ویژگی

>OL START=10<>LI<One>LI<Two>LI<Three>LI<Four>/OL

همچeنین می تeوان بeدون توجeه بeه رونeد عeادی شeماره گeذاری لیسeت , بeه یکی از در کنeار VALUEاعضeای لیسeت شeماره ای دیگeر اختصeاص داد. از ویeژگی

<LI.استفاده کنید >>OL<>LI<One>LI<Two>LI VALUE=6<Three>LI VALUE=10<Four>/OL<

بeا اسeتفاده از ویeژگی < روش شeماره OL دسeتور >TYPEهمچeنین می تeوان گذاری را بر اساس حروف و ... تغییر داد.

مقدار ویژگیمقادیر در جدول ذکر شده است. تعریف

A حروف بزرگ انگلیسی

aحروف کوچک انگلیسی

Iاعداد بزرگ التین

iاعداد کوچک التین

< مقداری ذکر نشود از اعداد استفاده OL در دستور >TYPEو اگر برای ویژگی می شود.

>OL TYPE = A<>LI<One>LI<Tow>LI TYPE=I<Three>LI<Four>/OL<

– لیست های غیر مرتب ) گلوله دار (2

< دستور به جای اعداد می توان از گلوله یا مربع UL< و >/ULبا استفاده از >استفاده کرد.

>UL<>LI<One>LI<Two>LI<Three>LI<Four>/UL<

از دسeتور این ویeژگی TYPEبا اسeتفاده تغیeیر داد. تeوان شeکل عالمت هeا را این دسeتور می 3 را دeارا می باشد.CIRCLE و DISK , SQUAREمeقدار

>UL TYPE = square<>LI<One>LI<Two>LI<Three>LI<Four>/UL<

– لیست های تعریف3یک لیسeت تعریeف شeامل تعeدادی عبeارت و یeا اصeطالح بeه همeراه تعریeف هeر یeک از آنهeا می باشeد.

< اسeتفاده eشeود. و قبeل از DL< و >/DLبeرeاeی سeاeخeت اeیeن لeیسeت هeا کeافیe اسeت eاز eدeسeتeور >< eتورeدس eح eاصطالe رeهDT<e ستورeدe ریفeتعe هر eاز eقبلe و >DD.شود eدادهe رeراeق >

< مشeخص DD< مشeخص شeده در گوشeه سeمت چپ و متeنی را کeه بeا >DTمرورگeر متeنی را کeه بeا >شدهe باe کمی فاصلهe از سمتe چپe قرار می دهد.

>DL<>DT<Term1>/DT<

>DD<This is the definition for term 1>/DD<>DT< Term2>/DT<

>DD<This is the definition for term 2>/DD<>/DL

نکته اسeتفاده مناسeب از رنeگ هeا در فeونت و پس زمينeه کeه مeوجب خسeتگی چشeم نشeود. *

بeرeخی از eوبالگ نويeسeان آمeاتور از رنeگe سeياهe بeه عنeوان eرنeگ پس زمينeه و از رنگهeای

رeوشن زeرد يeا سرخ eبه عنوان eرنگ منتخب فeونت اسeتفاده مeی کeنند.

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

هeربeار صeفeحه جeدیeدی بeاeز eمیe کنیeدe بeازدeیeد کننeده مeجبeور بeاeشeد چنeد ثeانیeه eبeرایe لeود

و eدeباش مفهeوeم انتeقeاeل eتeجه در باeیeد اسeتفاده eاز eتصeاویeر .eدeباش منتظeر eهeفحeص

اسeتفاده از تصeاویر نامeرتبط تنها صفحeات را eپرحجم eو بازدeید کننده را گیج می کند.

محتeوای مفیeد و کeافی. بازدیeد کننeده بایeد اطالعت مeورد نیeاز خeود را سeریعا یافتeه و *

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

اسeتفاده از یeک فeرمت و سeاختار مناسeب و پeاراگراف بنeدی بeرای متن. مطالعeه متن *

طeوالنی و بeدون پeارeاگراف بنeدeی صeحیeح نeه تنهeا eمشeکلe اسeت eبلکeه خواننeده بeرای

eا ازeه بسeچ eد وeنeمتن کe شeویeرف پeص eراe یeادeزی eانeمeز eدeایeبe ودeر خeظeن eوردeات مeکeنe تنeفeاeی

راe کلیکe کندclose.eمeطالعه eآن صeرف نظeر کرده وe کلیeد

<( title< this is title>/title * استفاده از عنوان اجباری است. از عنوان )>

مناسب جهت معرفی موضع صفحه استفاده کنید تا بازدید کننده به یک نگاه موضع

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

اهمیت ویژه ای دارد.

back * برای برگشت از صفحات فرعی به صفحه اصلی از کد جاواسکریپت

استفاده ننمایید

شاید بازدید کننده شما توسط موتورهای جستجو به یکی از صفحات فرعی وب

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

صفحات سطح باال وجود داشته باشد.

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

نمایید. آدرس پست معمولی و الکترونیکی- شمار تلفن، فکس و پیامگیر- و یک فرم

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

ارسال پیغام برای شما نداشته باشد.

استفاده از جدول برای سازماندهی اطالعات

یک جدول از تعدادی سطر و ستون تشکیل شده است. محل تالقی یک سطر با نامیده می شود.Cellیک ستون , یک خانه

در خانه های جدوا عالوه بر متن های عادی , می توان از متنهای ویژه Hypertext تصاویر گرافیکی و یا هر چیز دیگری که در صفحات عادی وب ,

قرار می گیرد , جای داد.< TABLE< و >/TABLEدر ابتدا باید مطالب درون جدول را بین دو دستور >

قرار داد.< قرار می TR< و >/TRسپس مطالب هر سطر از جدول بین دستورات >

< TD< و >/TDگیرد و در نهایت مطالب هر خانه جذول بین دستورات >نوشته می شود.

<TABLE><TR>

<TD< Cell1 >/TD><TD< Cell2 >/TD>

/<TR><TR>

<TD< Cell3 >/TD><TD< Cell4 >/TD>

/<TR>/<TABLE>

تنظیمات جدول ضخامت جدول را تعیین کنید.BORDER- با استفاده از ویژگی 1

>TABLE BORDER=عدد < …>/TABLE<

تعریف می شود.CELLSPACING- فاصله خانه های جدول با دستور 2>TABLE CELLSPACING=عدد <…>/TABLE<

CELLPADDING- فاصله بین متن درون جدول با حاشیه جدول از ویژگی 3پیروی می کند.

>TABLE CELLPADDING=عدد <…>/TABLE<

- در حالت عادی خود مرورگر طول و عرض جدول را تعیین می کند. ولی برای تعیین 4

استفاده خواهد شد.HEIGHT و WIDTHاندازه جدول به طور دلخواه از ویژگی های

>TABLE WIDTH = عدد HEIGHT = عدد<

…

>/TABLE<

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

>TABLE WIDTH =" مقیاسی بر حسب درصد " HEIGHT =" مقیاسی بر حسب درصد "

<

…

>/TABLE<

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

کنترل ظاهر صفحات وب استفاده می BODY دستور BGCOLOR* برای تعیین رنگ زمینه صفحه از ویژگی

شود.>BODY BGCOLOR = "رنگ"<…>/BODY<همان طور که فبال اشاره شده است به دو صورت می توان رنگ را مشخص کرد. که

آسانتر و بهتر است.Hexadecimalالبته روش * همچنین به جای تغییر رنگ می توان یک تصویر را پس زمینه کار خود قرار دهیم.

>BODY BACKGROUND=" آدرس تصویر در اینترنت "<…>/BODY<

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

( ثابت نگاه داشت.Scrollرا می لغزاند ) >BODY BGPROPERTIES = FIXED<…>/BODY<

می توان رنگ متنهای موجود بر روی BODY دستور TEXT* بوسیله ویژگی

صفحه وب را مشخص کرد :>BODY TEXT="رنگ" <…>/BODY<

گفته شد FONTبعالوه , همانطور که در قسمت آرایش متن , در مورد دستور

, می توان بوسیله این دستور ، رنگ , اندازه و نوع فونت هر قسمت از

متن را تعیین کرد.

می توان رنگ پیوندهای موجود در صفحه را LINK* با به کار بردن ویژگی

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

قرمز شوند.>BODY LINK="RED"<…

>/BODY< رنگ پیوندهای فعال یعنی پیوندهایی که کاربر , دکمه موس را ALINKویژگی

بر روی آنها فشار داده اما هنوز رها نکرده را تعیین می کند.

رنگ پیوندهایی را که قبال مشاهده شده اند مشخص می کند.VLINKهمچنین

>HTML<

>HEAD<

>TITLE<Example of BODY properties>/TITLE<

>/HEAD<

>BODY BGCOLOR = "#000080" text="#ffff00" link = "#ff0000"<

>H2<You can see all the texts on this page in yellow>/H2<

>H2<And the links are in red.>/H2<

>BR<>BR<

This is >A HREF ="page1.htm"<Link>/A<example1.

>BR<

This is >A HREF ="page2.htm"<Link>/A<example2.

>/BODY<

>/HTML<

MARQUEEساخت نوشته هاس متحرک ) می توان یک متن را بر روی صفحه نمایش MARQUEEبا استفاده از دستور به حرکت درآورد.

ویژگی ها ALIGN

تعیین می کند که متن مورد نظر در کدام قسمت فضای مخصوص MARQUEE .قرار گیرد

BEHAVIORروشی را که متتن بر روی صفحه حرکت می کند , تعیین می نماید.

مقدار حالت

TOP باال

BOTTOM پایین

MIDDLE وسط

مقدار حالت

SLIDE شود می متوقف دیگر طرف در و وارد طرف یک از متن

ALTERNATE به , و گردد برمی کند می برخورد صفحه حاشیه به وقتی توپ یک مانند متنرود می دیگر طرف

SCROLL ادامه امر این و شود می خارج دیگر طرف از و وارد طرف یک از متندارد

BGCOLOR را مشخص می کند.MARQUEEرنگ زمینه دستور

DIRECTIONجهت حر کت متن را مشخص می کند.

HEIGHT ( یا درصدی از ارتفاع Pixels را بر حسب نقاط ) MARQUEEارتفاع مربوط به

صفحه مشخص می کند.HSPACE

مقدار فضای خالی موجود در سمت چپ و راست را تعیین می کند.LOOP

تعداد دفعاتی که متن بر روی صفحه حرکت می کند مشخص می نماید. یا 1در صورتی که می خواهید به طور نامحدود متن به نمایش درآید مقدار را -

INFINITE.بدهید

مقدار حالت

UP باال

DOWN پایین

RIGHT راست

LEFT چپ

SCROLLDELAY

مدت زمانی را که پس از انتهای حرکت متن , تا شروع حرکت بعدی وجود

دارد تعیین می نماید.

VSPACE

را معیین می کند.MARQUEEمقدار فضای خالی را که در باال و پایین فضای

WIDTH

را بر حسب تعداد نقاط یا درصدی از عرض صفحه تعیین MARQUEEعرض

می کند.

مثال>FONT color="#0000CC" face="BOLD" size="4"<>MARQUEE behavior="alternate" bgcolor="#B9DCFF"

width="452" scrollamount="7" scrolldelay="120"<* HTML آموزش کدنويسي *>/MARQUEE<>/FONT<

حاشیه های خود حاشیه ایجاد کنیم تا به این طریق از MARQUEEمی توانیم در اطراف متن یا

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

می توانیم این دستورات را اضافه کنیم.MARQUEE و یا FONTدر قسمت کدهای

Style =" border اندازه نام حاشیه رنگ :

مثال

>FONT color="#0000CC" face="BOLD" size="4"<

>MARQUEE behavior="alternate" bgcolor="#B9DCFF" width="452"

scrollamount="7" scrolldelay="120" style="border: 4px double

#0000CC; "<

* HTML آموزش کدنويسي *

>/MARQUEE<

>/FONT

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

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

و ...!

END

KhoramiID Yahoo and Email: v1367_online

Documents

مختصری در مورد کدهای HTML لطفا قبل از باز کردن کلیه پاورپوینت ها فونت های پیوست را نصب نمایید