صفحه 1:
اموزش كامل
برنامه نویسی
شرکت مودال
صفحه 2:
منظور از وب چیست
* منظور از وب چیست؟
* وب شبکه ای است متشکل از تمامی کامپیوترهای دنیا؛
شبکه ای از شبکه ها.
" اينترنت؛ وبء (اع /نا» /الالالالاا يا ع0 ألالا 0110 لالا
perp eee eye a |)" (-10)
تمامی کامپیوتر های وب میتوانند با هم ارتباط داشته باشند.
۱0 ee OOTP eer ren
. يريوتوكل 41171:2] با هم ارتباط برقرار ميكنند
صفحه 3:
نحوه ی کار کرد وب چگونه است
نحوه کارکرد وب چگونه است؟
اطلاعات وب داخل فایلهائی به نام ۳۵065 ۷۷60 و يا صفحات وب قرار
۳۳
اين فايلها يا صفحات روى 5611/61 (اع/الا يا كامييوترهاى سرويس دهنده
وب ذخيره شده اند.
براى ديدن صفحات وب از نرم افزارى به نام مروركر و یا ۷۷/۵
و ل meee
5 مروركر Netscape Navigator 5 Internet Explorer >35
معروفترين مروركرها حساب ميشوند.
0 ار ل لت ل ¢)-1a S Ee)
اه ع ا الال ات ل لك كت \ Teh [e [=] kel
صفحه 4:
0
در در
NP Ueber ern ا ae ere eI Srp reenL
ا لي ee rae
" اين 601651 يا درخواست بر اساس استاندارد ارتباطى يا
يروتوكل 18 11] بوده و شامل آدرس صفحه مورد نظر ميباشد.
ل چیزی شبیه
ul http://www.internet.com/fag.html
بخش //:۱۲60] نوع پروتوکل و یا استاندارد ارتباطی را تعیین
ميكندء ره ره
و 30.۳۳۲ نام صفحه ای است که باید خوانده شود.
صفحه 5:
مروره گر ها چگونه صفحات وب را نمایش
مى دهند
چگونگی نمایش یک صفحه وب بصورت مستتر در آن
وجود دارد.
ا Rarer renee ewe
كمك تك ها به نمايش صفحات مييردازند.
وظيفه اصلى تك هاى اجتمل ( 15305 111/1 ) بيان
حِكونكّى نمايش اطلاعات ميباشد.
يك تك اجتمل جيزى شبيه <> اين تك ياراكراف است!
</0> است
a
صفحه 6:
0
eee ee eo رتیت 3 ییا
متال بخش مقدمه را در نظر بگیرید:
۳ html><head><title>Title of>
page</title></head><body>This is my first html! page.
Sy jl sl 4igei ***<<b>This text is bold</b></body></html
عنصر اچتمل:
<00۱0>/0 وا ۲6۵ 5ز۲0<>عنصر اچتمل بالا با تگ <وا> شرو
9۳۳ 1
REMIND PIE te CES DECC I4)
one CPST lc 1
body>This is کال بل رن homepage. <b>This text is>
سوت شروع شده واباتكق PE ۳۷۵۰۷0 7
Ned 0> پایان می یابد. همانطور که میبینید گاهی یک عنصر حاوی یک یا چند تگ دیگر
.وظيفه ۳( و 5
0 ا ا NE ener Fea Kee Cae PN)
داده خواهد شد.
و باتگ
. لازم به
صفحه 7:
شناسه های یک تگ (عصط ۷ )
1 Ue Meee ne res ا Weer ees ees Pee)
۱
177۱ 1 fo <e lal ie) oes eeO eS eee) با
اگر میخواهید که رنگ زمینه صفحه اچتملتان سیاه باشد کافی است که به شکل زیر عمل
<"body bgcolor="black>
در مثال عم 00> داراى جهار شناسه مختلف با نامهاى Bail sata alle) alata
ا ل ل ا 0
0" width="100" height="60" align="center" > >
table border='
۵۱/>>
شناسه ها به صورت كلى "مقدارحنام" يا "©ل)|2/١30076-1]" نوشته ميشوند و هميشه به تك شرو
یک عنصر یا ]۴۱6۱6۲۱ اضافه میشوند ود تا مرت ا ا
نشوند از مقادیر قراردادی با ا[ا06]3 آنها استفاده خواهد شد مثلا در تگ 000 اگر شناسه
لخدو رم سفيد براق زمينه صفحه اسنتفاده خواهد شد.
Vy aul Sy she داخل نويسه هاى " و يا ' بنويسيد و اختيار دست شما است فقط در مواردى
Brae Piers 00 oo
صفحه 8:
0 oe
سر تيترها با كمك تك هاى <1([> تا <1(6> تعيين ميشوند.
<11> معرف بزركترين سر تيتر و <176> معرف كوجكترين
سر تیتر است. مرورگر به هنگام نمایش یک سر تیتر بصورت
اتوماتيك يك سطر خالى قبل و بعد از هر سر تيتر اضافه خواهد
كرد.
h1>This is a heading</h1><h2>This is a> =
heading</h2><h3>This is a
heading</h3><h4>This is a
heading</h4><h5>This is a
heading</h5><h6>This is a
<heading</h6
صفحه 9:
(Paragrapks) eal SIU
و CS SEB ere
هنكام نمايش يك ياراكرافه بصورت اتوماتيك يك سطر
خالى قبل و بعد ان آن اضافه خواهد كرد.
p>This is a paragraph</p>> *
<p>This is another
عمتال ۵
صفحه 10:
۱) easy re
" براى رفتن سر سطر جديد از تك <1(]> استفاده ميشود.در
اينحالت يى ياراكرراف جديد ايجاد نميشود. تك <> از
نوع تك هاى خالى بوده و داراى تك انتهائى (مثلا
ل
p>This <br> is a para<br>graph> ®
<with line breaks</p
صفحه 11:
کامنت ها در اچتمل a) 007
" برای نوشتن شرح و توضیحات در مورد کدهای اچتمل باید
از تك خاصى استفاده كنيد. براى اينكار بايد متن و
eye oor) ا ا كت
هاى 601771116101 را در نظر نكرفته و محتوى آنها را
نمايش نخواهد داد و فقط شرح و توضيحات براى برنامه
نويس و ديكر افرادى كه احتمالا در آينده با كد اجتمل كار
خواهند كرد مفيد خواهد بود. (به محل نويسه "!" توجه كنيد!
فقط يكى و آنهم در ابتدا)
<-- This is a comment --!> "
صفحه 12:
چند نکته کاربردی:
اتوجه داشته باشيد كه بدليل وجود مروركرهاى متفاوت (اكسيلوررء نت اسكيب؛ ..) و به دليل تفاوت دقت نمايش صفحه
NGA CaS OS TONE Pcs ااا اا 00
STOW S Sire ae lecon adit eB Ste oS Spey ope mes yo ete
امکینتاش چک کرده و همچنین در دقت های نمایش 800600 و 102426768 آن را امتحان کند.
eet Nuts را رک
خواهد بود. هميشه به ياد داشته باشید که فاصله های اضافی (50266) و خطهای خالی متن در صفحه ادیتور توسط
ا
یک فاصله خالی باید از نویسها ی ا 0 000
۳ 1
۱ wre ee en nye rene)
17:17 6 7۳0 ۳۹ 0
بر ی را
ر بصورت یک فاصله یا 5026 نما
برای ایجاد یک سطر جدید هیچگاه از یک تگ <و> خالی استفاده نکنید و به جای آن از نگ <و> استفاده کنید..
مرورگرها به هنگام نمایش بعضی عناصر بصورت اتوماتیک یک سطر خالی قبل و بعد از آن عنصر نمایش خواهند
eran Ome Le tor Erde es 1
1 ااا © Cer late Cane mee
|صفحات با كمك اين تك از أهم جدا شنده اند..
صفحه 13:
ار
در جدول زیر عناصر معرفی شده در این فصل به همراه لینکهای مربوطه جهت مطالعه بیشتر
آورده شده آست. توجه داشته باشيد كه براى هر عنصر فهرستى از شناسه هايا 5ع]لا0| اك
به اا م ل ل ل
و سعى كنيد كه از آنها استفاده نكنيد.
دهم وج تور وی <html>Defines
616 11لاع0 0)نشانشسروع متنلجتم[16'5] 1لا 00 16 11065 6</ا0001 >
<hi>-<h6>Defines UitexeX ا ae) Beemer oll NA
16 >< 66۳065 1تعریفسر تیترهایا تا و to heading 6
۱7۳ لور ل رازه
<!-->Defines a,iil bs tli<hr>Defines a horizontal rules-> خط
10 nee rade e soni یرای
صفحه 14:
دو نكته بسيار مهم در مورد فارسى نويسى:
ا
ید be aig a ee
است که مطالب این 1 فکته مهم در مات
09 صفحات فارسى است كه براى ايذكار بايد از
10
ass ee UCU MS en ee eet ca
الور مروركر يا ]ع8/010/5 قبل از eS Beha Teena eee 0
ايكر مثلا نيازى به تعيين دستى (دراكسيليرور ) : 0168-8 / 01009/10012006 1601/806/] ) نوع ومأمعمع م
و reece
Cerner te cee
ed (ep meee Cages Ieee et ee ane ter در مورد متین جملات فارسی باد با
کمک روشی جهت تمایش پیش فرش را به "راست به چپ" تغیردهید. شناسه یا 2127:0086 ی به نام 3 یا مان مرع 07۵
ين كار را براى شما انجام ميدهد. اين شناسه داراى دو مقدار ممكن ميباشد
UTF-8 ى
"itr" , Left-to-right text
ت۱۱ ر جب
ما برای نیش جملهفارسسی "سلام بر دنیای وب!" با کمک عناصر م یا ال کافی است که به یکی از شکلهای زیر عمل شود:
mea ysl| ی
BN ener ee ten eels eae
أدر بسيارى از عناصراو تك هاى اجتمل اسكان استفاده لز شناسه 01 ميسر بوده و به عنوان نمونه ميتوان لزأ عناصر زير نام برد:
<, حانامما> , <قط ... 01> , <لا> , <> , <هاطقا> , <تزووط> , <اصاط> , <زة> , <م
,<<pre>, <select> , <span
صفحه 15:
نحوه دیدن سورس کدهای اجتمل ALTDOL)
(Goure
ام ال ی تس در را کافی است که در متوی /۱۷6۷
es Sie ل ا ل ل ا ل ل 3 ل
درون اديتورى باز كرده و قابل ذخيره توسط شما براى استفاده هاى بعدى ميباشد.
Ie Brees) ا ا 0
سورس كد اصلى فريمها كافى است كه ابتدا با كمك روش بالا به مشاهده سورس كدهاى اجتمل
يرداخته (لازم به توضيح است كه در اين حالت فقط تعاريف كلى فريمها قرار دارند.) و سيس
برای دیدن کد اچتمل اختصاصی هر صفحه باید پس للك ۲۳۵/۲ روی هر صفحه
"50100566 /لا16/ا" كرده و كد اجتمل هر فريم را جداكانه ببينيد
SI طراح سايت با كمى 6م5671 ew Sey HED) eleva ا
PES SPM Kelley inca iia 0) lalla si-roll gin @ltscolgam KAZ
ا ee ۱
ISSN5
صفحه 16:
چند نکته کاربردی:
در استفاده از 1006۳۱۲۱6 eer اك اكثر
مرورگرهاء پیوندها با این خطوط ن شان داده مي شوند و این
مساله میتواند کاریران را دچار اشتباه کند .
Peeters رگ رات (C= Petes Dee
و 8 هستند ء اين أطمينان را مي دهد كه صفحه شما توسط همه
EWE ESS ل ا D Ee ew SP ee
به ترتیب بسته شدن تگهاي پاياني در مثال زیر دقت کنید. همان
ow Crean ا 0
شروع شده است » به همین خاطر تگ خاتمه دهنده آن قبل از
ا لل ل
U>version>
<<STRONG>2.0</STRONG></U
صفحه 17:
تكهاى فرمت دهى متون
" ع05م:لا5 130 :3غ 5كاربردلاء] 6010 065165]<ط>نمايشتوير
لاع 19 10068065< 10> نمايشدر لندازم بزركو00<106/10©>
غلا 607010351260 نمايريصور تتاكيد شد ||1]8 1<100611065 >
غ/امنمايشليتايكييا كسجلاء] |517731 5003||<10661065>نمايشدر لندازم كوجىف
6 ند ۲65 < 5۲۲0۳9 >نماش‌قو ی؟651 6110 (] <حاناو>
ا 06عم11ع05لاونمايشيايينتر از خط لفقروع 10661 <29لا5>
6 66156110660 ناونمايرباثثر از 3& <ins>Defines inserted
غلاع]نمايشبه صورتخط زيرغكاع] 0616860 061<1061765>نمايشريه صورت
خط خوردم<[17566360 <|06 > ع5لا .3660ع06ع(] < و1
Jistrike>Deprecated. Use <del> instead>c 4 )1
¢J4 21) jlu>Deprecated. Use styles instead>z is
<code>Defines computer codes )-sStart TagPurpose *
6 ]نمایش‌کدهاویرنامه نویسی]6(6] 6۷0۵۲۵ 661065( <00] > نمایش‌متن
Uilai<samp>Defines sample computer codesuls ssivat ) pos
fer PAM EES celia (18 oy ee ee ees
31301 3 066065 <3/>نمايشمتغيير هاوع 6ع (]<ع]م >
ل ا 0
صفحه 18:
Character Entities و
Fe mC eerste sar Seer TaPo EE oY ny eonpa poms
کع 6۳۱ ۱۵۲۵016۲ ظ لستفادم کنید. یکوع|] 6۳0۷ 0۱8۲۵616۲ از سه قسمتتشکیل
papery
نویسه (6) 2۳006۲5۵00
2 نام 6۱0 با نوسه #و سپس‌شماره عددی ناه
3 -و نهایتا نویسه 56۳016010۳ (:)
IO [tw eey EP SOLON Sree EY BON ECT pay 0
در لین‌متللا| نام 60۱۷۱۲۷ و 6000 شمارم عددی‌ن‌میباشد.
pie] ayes Ses ا ا
ا ا ام ا Peer et AN
اره های عددی 6۳01107 هارا بخوبی میشنانند. توجه داشته باشید که 6۳0118
وركي حروف حساس هسئند و در واقع ©/ا[]5©151 ©35) ميباشند.
tl ال ا ا ا ا 0
PN stolen ole-t-lidialepejol-a su neees) م ام ا
در نظر نگرفته (50۵665 ۲۳0۵1:6) و مثلا از 100 نویسه فاصله» 0 تای آنرا نادیده میگیرند و
برای نمایش فاصله های اضافى بايد از 0۳506 استفاده کنید.
رت
صفحه 19:
ا ل 4 6 ۱
Entity Name(¢_—) Description(.4) Result *
non-breaking Gs. 2 4.4) Entity Number(¢\4)
space  <less than<<>greater
than>>&ersand&&"quotatio
ais;n mark""'apostrophe '
۱ زرد وت توا
ResultDescriptionEntity NameEntity Number #*
¢cent¢ ¢£pound££¥yen&
yen;¥§section§§©copyright&cop
y;©@registered
trademark®® x multiplication×&#
لالص
صفحه 20:
تگ وبلاوج؟) و م
و ۱9
۰ Bao: 01
اشاره کنند.
فرم كلى يك بيوند به قرار زير است:
<ة/ >1 و
ene, ا بکار رفته است. برای تعیین
مقصد و یا آدرس صفحه جدید از شناسه ای به نام 1۲6۴] که همان دا
NOS NOL Te ener TO ms Cee ee eer) reference سرا
9 بر ای ) كه Bere ere eye ornare ag
Tae tee eA خواهد Rees eas reer Pees eee
قرار داده ميشود و هر جند كه در مثال بالا اين بخش متن "]“© 71 ©5017" است ولى ميتواند
حتى يك تصوير باشد.
براى نمونه كد اجتمل زير ييوندى به سايت 6017. 000016 ايجاد خواهد كرد:
a href="http://www.google.com/">Visit Google>
>516>/2
صفحه 21:
شناسه بصي-ب, در پیوندها:
با كمك شناسه 131061 امكان تعيين مقصد ييوند جديد فراهم
ميشود. در مثال بالا يس از كليك روی پیوند مروركر سايت
ا ا 0
اگر میخواهید که مرورگر پیوند را در صفحه ای جدید باز کند باید
وت ۱ زور۱ ۱ ۱
OleT) 0 ورت 0 ا ۱
آخواهد شد:
a href="http://www.google.com/"> ®
<target="_blank">Visit Google Site</a
صفحه 22:
شناسه وه :
ااا 0
مختلف یک صفحه یا 0806 را فراهم میکنند. در ایتصورت مثلا برای رفتن به آخر يك متن
01 5001 كردن تعامى صفحه نيست و كافى است كه بازديدكننده روى
اكليك كند.
0000 era
: ایجاد یک پیوند نامگذاری شده (اين قسمت به عنوان لنگر کار خواهد کرد.) -)
|
<3/>لعلاةامداك عط مغ ۲6۸ <۱۵061۳ 02۳062۳ و> رظینه شناسه 0۵۳06 تعین نام برای
بيوند است و مقدارآن همان نام بيوند ميباشد. نام بيوند هم هر نام لاتينى ميتوائد باشد. در |
ae 10 د عبارت "0ع/ا13م015 66 0 (16" خواهد بود. مثال زير به ايجاد يك
SERPS CUE 2100
Ra Screen) Mean) Rang pees fae 2
ا ا اننت که پیرندی معمولی ایجاد کرده و ل 0
مقصد وا سيس نويسه ## و در لهايت نام بيوند نامكذارى شده را درج كنيد ینک
نامكذارى شده أى به نام |0 اشاره ميكند.
و ا ا 0
مستقيما به ابتداى بخش 00] صفحه 10060.71 خواهد رفت.
لگر مقصد پیوند در همان صفحه قرار دارد نيازى به قيد 1]لا نيست و فقط نويسه # و سيس نام بيوند كافى است:
<a href="#top"> Goto Top! </a>
صفحه 23:
چند نکته کاربردی در مورد پیوندها:
۰ * یکی از کاربردهای رایج پیوندهای نام گذاری شده در
صفحات و متونی میباشد که فهرست و یا لیستی از اقلام
نمايش داده شده استء مانند بخش سرفصل مطالبء فهرست
60/] و يا ... در همين صفحه در دو مورد از ييوندهاى
نامكذارى شذه استفاذه شده استء آيا ميتوانيد آنها را بيابيد؟!
SES Ia ا كك
ابتداى صفحه مقصد را نمايش خواهد داد.
صفحه 24:
ام تسم
با كمك فريمها قادر به نمايش همزمان بيش از يك صفحه وب در
ينجره مروركر خواهيد شد. a دا رون
ناميده شده و فريمها كاملا مستقل از هم ميباشند. محتواى هر فريم
هم میتواند هر صفحه یا وب سایتی باشد. هر چند که فریمها طراحی
Pe tere rere eis iby serom eee art iy
(CORI Orr reer terre cnn
مغانت 7
موتور‌های جستجو با صفحات طراحی شده با فریمها مشکل دارند.
چاپ و 0/1۱1 صفحاتی که از فریمها استفاده میکنند مشکل است.
صفحاتی که از فریمها استفاده میکنند معمولا مبتدی بودن طراح
سايت را نشان ميدهد!!
صفحه 25:
(@raxvesert) رل a
تا
EDS SIE)
Ip pUey eu eeE TODS EE Ree Sila nl] eres
0 ا ا eee OS)
با كمك شناسه هاى 010/5] و 0015 ابعاد و نسبت هر فريم تعيين
ميكردد
JA </html> s <html> cS os <frameset> 5
۲۲2۲0656] میگیرد.(نیازی به قید تگ 000۷ هنكام معرفی یک
دجم
صفحه 26:
0
000 ا 2 ل | n{ =e CS
در فريم ها نمايش داده شود.
مثال زير مجموعه اى از فريمها را كه شامل دو فريم عمودى ميباشند معرفى
ميكند. از سمت جب فريم اول ©72 درصد و فريم دوم ©© درصد از عرض
پنجره مرورگر را به خود نمایش خواهند داد. در ادامه تعریف محتویات هر
eCCNOn Ee Ware is SB) یاهنت ریت۱
اوه زو ررا مروت رای
html><frameset cols="75%,25%"> <frame>
src="frame_left.html"> <frame
ole<src="frame_right.html"></frameset></html
نمایش مثال بالا به سه فایل نیاز دارید»
۳۱۰۲۱ 5 frame_left.html «frame_right.html
صفحه 27:
1 eae ree
۱ Lem eres ES ES Toe) BS Le meee re]
اق ا و ار تور( مسر تمد بر روخ كر رركي علامت 2 تعیین
تعداد و اندازه رديفها در فريم ستمثالهاى زير را در نظر بكير
Melee tees (eo) tobe io) Oh ns odie ila Oa مثال
<frame src="frame_3.html"> <frame
src="frame_2.html"> <frame
و ا ل 0
سطدر سای تم
0 * مشخص Pa Oa ae
۳
DD 1
صفحه 28:
تگ های فریم
۰ 6 "2۳ ک اربرد
<frameset>Defines a set of
ار ۹۱8-۱۸۸۱2
4;)-Defines a sub window (a frame)
<noframes>Defines a noframea 452
section for browsers that do not
هو ۱ ۰۱۳ ۶ 9 9 ۱( ۲9 ۱۳
که از فریم يشتيبانونميكنند. < 111310006 >
Defines an inline sub window
ار هائدرجا (عأ1أ)
صفحه 29:
کر نامرتب(طآ لحم مر
فهرستهائی هستند از یک یا چند قلم اطلاعات که معمولا با دلیر های کوچک و سیاه رنگ در
ا ا Se tee reine e el ee
اطلاعات با تك <1]> مشخص إدد.
5 انمايشتوسط ۲ | ال 11 code
ps0] bed bed tle bd] ped} [4 |p| bala -\lad) eae Oi
Red
Blue
Green
<li> </ul/>se<li> <li/>4<li><li/>sei<ul dir="rtl" ><li>
اقهوه
شیر
oe
داخل تگهای <]۱> میتوانید از پاراگرافهاه تگهای ۵۳ » تصاویر و حتي فهرستهای دیگر استفاده
کنید. به شناسه ]له در مال بالا توجه کنید. امکان تعیین سمت و جهت نمایش متون در تمامی
INO ۱۱ ce
صفحه 30:
Lares و ار(
اعداد به جاى دايره هاى كوجك سياه رنك استفاده ميكند. hci رو و
شروع شده و ا ا ا ا
لي
مروركر<01/> <1/>مع66ن < [|> < [ال>عنا8 < | > <[ال> لعج <> <ام>
Red
كلت
Green
ای
اقهوه
اشير
55
داخل تكهاى <[|> ميتوانيد از ياراكرافها. ا؛ تگهای 9۲ ۰ تصاویر و حتي فهرستهای دیگر استفاده کنید. به
شناسه ]01 در مثال بالا توجه كنيد امكان تعيين سمت و جهت نمايش متون در تمامى تكهاى مربوط به
'فهرستها ممكن ميباشد.
صفحه 31:
فهرست تعريفى فهرستى است از اصطلاح ها و تشريح و توصيف آنها.
فهرستهاى تعريفى با <01> شروع شده و هر نوج اصطلاح و تعريف مربوط به آن با تكهاى
<0> و 00> تعريف ميشونئد.
00 11011 لإنمايشتوسط
م ا ۱۰۱۳
Protocol</dd><dt>FTP</dt><dd>File Transfer
Protocol</dd><dt>IP</dt><dd>Internet
Protocol</dd></dI>HTTP Hypertext Transfer Protocol FTP
File Transfer Protocol IP Internet Protocol <d! dir="rtl"
0 > < >مقدمه</0]<>00>خلاصه لاز مقدمه</06 ><00> فصل
ل ل ا ا ا لي ل 0
Cony eS ET re earner Sides eee
© خلاصه لواز فسصل© دا اىمتشريح يعنى<00> ميتوانيد لز يارلكرلفهاء تكهاى
POETS og ا ا ل ا 0
نيد لمكانتعيينسمدتو جهدتفمايشمتوزدر تمامىتكهاومربوط به فهرستها ممكن
صفحه 32:
تگهای فهرست
* تگهای فیرست
<ol>Defines ans:j-SStart TagPurpose "
۲ 0۲06۲60تعریفف هر ستهاوپر ند 671065 نا <ابا>
مورا( رت زوارت 2۱۳۳9
10 115 وتعريفيكليتم و قلم از یکف پرسندال >
ل ا 2 حر تاه اك ۱۳-0
term 0680110 3 01<1068165>تعريفلصطلح در
فهرستهائتعريفي<11]6101 0115© 3 1165ع0] <00
010 إوتعر يفمعنىو شرح لصطلاح در فهرستهاى
تعريفى
صفحه 33:
" تمامى عناصر و تكّهائى كه تاكنون ديده ايد فقط به نمايش اطلاعات
پرداخته اند و هیچکدام به گرفتن و اخذ اطلاعات از كاربر نيرداخته
so) gag pre n CSPe U ۱ ۳(
قادر به جمع آورى و اخذ اطلاعات از بازديدكننده سايت خواهند
eS ا ل 1 ۳
دريافت و ارسال اطلاعات به سمت وب سرور كمك خواهند كرد و
ات ا ا BIOS
ی ل 5
" درون تك فرم كروه زيادى از عناصر و تگهای مختلف قابل استفاده
ل ا ا ا ا ات 0021
عناصر ورود متنهاى جند سطرى (7]3162© 1)؛ منوهاى
sfadio buttons s drop-down ..
صفحه 34:
Gee re
* به عنوان پر مصرف ترین تگ مربوط به ورود اطلاعات
باید از تگ <ألام(][> نام برد. در اين تگ شناسه ای به
نام ©06/] به تعيين نوع اطلاعات ورودى اختصاص دارد.
مقادير ممكن براى اين شناسه به قرار زيرند:
text , checkbox , radio , password ,
hidden, submit , reset , button , file,
image
در ادامه به شرح بعضى از ©0]/إ] هاى كاربردى خواهيم
يريداخت:
صفحه 35:
۱9 ( ero ney ERY)
0 PS eM ا Pe cP Um eee een Ce er
مقدار "]اع]" ا میشود.
كد اجتملنمايش توسط مروركر< "اه "عع م لإ لام > :عطقم غكرأع <اصره؟
name="firstname"><br>Last name: <input type="text
/ name="lastname”></form>First name:
input type="text">:-._——< "Last name: <form di faa)
fe) ا ا ا ل
ل ل لم0 an
ا ا ا ا ا ل ا ا
0 ا ا ا ام ا Te NCEE Tees]
مقدار ۲۸۱ آن توجه داشته باشید.لازم به یادآوری است که اغلب مرورگرها در حالت پیش
ice le Se ree ie ees re rae ree eee)
بيش فرض وروديهاى متن را تغيير دهيد بايد از شناسه اى به نام 5126 استفاده كنيد.
صفحه 36:
۹
*_اگر میخواهید که بازدیدکننده گزینه ای را از بین چند گزینه محدود انتخاب كند»
از مقدار "۲۵00" برای شناسه 06 10 استفاده کنید:
ice) danbee lel ele mia ota ا ا a)
name="sex" value="male"> Male<br><input
type="radio" name="sex" value="female">
Female</form>Male
Female <form dir="rtl"><input type="radio"
br><input>s » <"name="sex" value="male
<"type="radio" name="sex" value="female
زن</0111؟>مرد
زن همانطور که مشاهده میشود فقط امکان یکی از گزینه ها برای کاربر میسر
ات
صفحه 37:
وروديهاى مر(
اكر ميخواهيد كه بازديدكننده يك يا جند كزينه را از بين جند كزينه محدود
انتخاب كندء از مقدار "“01>اع©(61" براى شناسه ©(لاغ استفاده كنيد:
کد اچتملنمایش توسط مرورگر <الا0 ۳ رن
type="checkbox" name="bike">I have a
bike<br><input type="checkbox" name="car">1
have a car</form>| have a bike
۱۳۵۷6 5 6۵۲ ۲۵۲۳۱ 01۲2۲۲۲۱۳۶۱۵۷
تک ری رکفت رف 9/۱
تا کر ۰ ۱1۱۱9۱5 ره ۱9
دارم</۲0۲۳۱>دو چرخه دارم
ماشین دارم
صفحه 38:
ل وربرانظ) در فرمها
ا tribute مر رم
رس(
سار لس ار را ار
مر بروی این دکمه ل Petters vole ree ۱۹
task oldu csope te kai ee ew oper omer etre لت
. مقدار شناسه 36181017 أدرس يا 61لا فايلى است كه به دريافت و سيس يردازش اطلاعات
دریافتی خواهد . معمولا فایلهای بخش 21101 برنامه ها و اسکرییت هائی نوشته شده با
ربانهای زو مانند ۰۳۱۷۴ ۳۵۲۱ ۸۵۸5۳۰ و ... بوده و وظیفه آنها دریافت اطلاعات فرمها و سپس
دازش آنها میباشد
تعيين مقدار "5161016" براى شناسه ©م لاغ سبب نمايش دكمه 506116 يا ارسال خواهد كرديد.
كد اجتملنمايش توسط مروركر< "لام م|"ع- 7306 1017
action="form_action.cgi">Username: <input type="text"
مصیای هو را نم وک 56۳ 23۳06
value="Submit"></form>Username: <form name="input"
input type="text">)s -u<"action="form_action.cgi" dir="rtl
eee sees 3/0 ubmit" valué="Submit"></form روا وس
کاربر در مثال بالا در باکس ورودی متن؛ کلمه ای را وارد B Soper see eyo)
به محض کلیک دکمه ارسال» اطلاعات درون فرم را که در این مثال متنی ساده است به سمت فایلی که
در شناسه 3611011 تعیین شده است ارسال کرده و در اين مثال برنامه ای به زبان |۳6۲ با نام
[0۳۲۳۳_201100.09] در سمت سرور به ذخیره و سپس نمایش متنی خبری خوا
صفحه 39:
ورود متن فارسی در عناصری مانند 4اع] 4عو۲»
يا مه رو
* همانطور که در متالهای بالا مشاهده کردید در مورد المانمای 71610 16 و
۵ با کمک شناسه 01۲ میتوان سمت و جهت ورود اطلاعات را
Serio tn eee 0
ene nes wee Se) لت
به ورود اطلاعات به زبان فارسی نخواهد بود و نویسه های تایپ شده لاتین
خواهند بوداء در اینگونه موارد چه باید کرد؟
معمولا برنامه نويسان وب براى فراهم ساختن امكان ورود متن فارسى از يكى
از دو روش زير استفاده ميكنند:
٠ استفاده آز ايلتهاى جاو با اين مزيت كه سورس و كد اصلى فارسى سازى
قابل استفاده توسط دیگران نیست!!
ل م ل ا لك
F-\V/-lciel glo) ا م
صفحه 40:
تگهای فرم
form>Defines a form>s.j-SStart TagPurpose =
fa) ob ice واه تخزرارتزه EDEL رت
Input <textarea>Defines 3 آتعریفورودعاز ۱0۱۱۲ ۵
۲۱۵ (a multi-line text input control)
text-area<label>Defines a label Lis po ورودعمتنجند
label <fieldset>Defines a Las +4 to a control
fieldset<legend>Defines a caption_+—fieldset
Ailey oe کات رت
select>Defines a selectable list (a drop-down>s
ولت لت لي ات
4: s~box<optgroup>Defines an option group
option>Defines an option in the> option group
drop-down بر و box
ها<011] ]لاط ١51نام 3 0<1061165]]لااتعر يفدكمه فشارى
fa} ob] eed) LU mola nome p ery
صفحه 41:
تگ پس؛ و شناسه بو یا سر
و
تگ <۳9> از نوع تگهای خالی است. بدین معنا که فقط دارای
يك يا جند شناسه و 3661111056 بوده و داراى تك انتهائى يا
ianle bd 0
" مهمترين شناسه براى درج و تعريف يك تصوير ع5 يا ع©1ل501
نام دارد و مقدار اين شناسه آدرس یا ]لا تصویر میباشد.
تصاویری که مرورگر در یک صفحه وب نمایش میدهد میتوانند در
همان دایرکتوری صفحه اچتمل» در دیگر دایرکتوریهای همان سایت
و یا در فضای بیکران وب قرار داشته باشند.
صفحه 42:
شکل ساده در ج یک تصویر:
<"img src="url> ®
" مقدار |]لا آدرس اينترنتى تصوير ميباشد و مثلا اكّر تصويرى كه
قرار است كه در صفحه درج شود در همان دايركتورى قرار دارد
و نامش er een eco me.jpg ا 000
بعنی ۳۱6,[00] را بنویسید و اگر تصویر در سایتی دیکر قرار
دارد 11لا كامل آنرا بنويسيد. مثلا تصوير لوكو سايت
G url Gls google.com 314
http://www.google.com/images/logo.gif
است.در این ۲۱لا نام تصوير 090.01۴ بوده در دایرکتوری
۳۱۵065 قرار داشته و روی وب سایت 000916.6010 قرار
دارد.
صفحه 43:
ری
* کاربرد شناسه های ۷۷[01|1 و ]6[91۱ تعیین عرض و ارتفاع نمایش تصویر
ccm en cieege is ms Simca ا 0
Ree rene ore See ener Tis eee Es ne Seer eee)
غیر از مقادیر واقعی طول و عرض تصویر میتوانید به شكل و ابعاد آن
SS aes as ee ee 9
eS eer DIED Eee
img> *
src="http://www.google.com/images/logo.gi
Leia 48 a phe dues < "Ff" width="276" height="110
ا ااا ل ل لكك
سیب کمک به مرورگر در تسریع شروع نمایش صفحه خواهد شد.(در واقع با
قید ابعاد تصوبر» مرورگر قبل از لود تصویر میداند که چه مقدار از صفحه
rts re teeter) لك
صفحه 44:
ا یا "ها عمب-سوات" يا متن Res
اگر مرورگر به هر دلیلی نتواند که یک تصویر را نمایش دهد و یا مرورگر از
OER Tar ل ۱
کمک شناسه ]| تعبین شده است نمایش داده خواهد شد. همچنین در اغلب
ل TEE Te CUED TOT NE 1
PRB peg yer le rer UA Ir] | eco SEEN Ear Ye teNIr- | | een Eng
تصوير قابل نمایش میباشد.مثال زیر نحوه درج تصویری را با قید متن
جایگزین آن شرح میدهد:
img src="images/AkseAlaki_88_31.jpg">
<"alt="Fake Pic
صفحه 45:
"0 ee Sey
PC eae gov ce orn ee ete Ee gi Eg peace CENT ECPI Cw EPS]
پیش آید:
۱ eae Cree Se Tad (ae
.ديكر قرار دارد استفاده كنيد. در اين حالت از
: مانند »
img src="http://www.google.ca/images/hp0.g
< width=258 hei
Uwe we HOES oe ree ee ا ا De Te ene)
شما هم میخواهید از آن تصویر که در سایتی
211111111111110
٠ ب) تصوير روى هارد كامييوتر شما است و هنوز بروى وب منتقل نشده است. د
چون اغلب ل ا ل 0
IESE) ۱ 0 ۱ سرت سس حرط
مجانى براى ساخت صفحات وب و ذخيره اطلاعات و تصاوير در اختيار شما قرار ميدهند و
۱ نا
مر رد۱۳ )0\-)0( a EOI NAO) ۱ ۳۱0 ۱۳۷
سپس در شناسه 5۲ از تگ ۳09] آدرس جدید تصویر را قید کنید.
صفحه 46:
اسف ولد 2
ا on Ee A ا ا ۱
فايل را لود كند.( خود صفحه به علاوه (00) تصوير)
استفاده از تصاویر» سرعت لود شدن صفحات را پایین می آورد.با احتیاط از
ا ا ا م
ا ل ا ۱
281005 استفاده میکند حداقل (SG ثانیه طول خواهد کشید.
براى ديدن مشخصات تصاوير در وب كافى است كه روى تصوير 58101
>اع1اع كرذه و سيس در بخش 106116165 آدرسءابعاد و ظرفيت تصوير
را
براى ذخيره تصاوير در وب كافى است كه روى تصوير >اءذاء غ8191 كرذه
و سيس در بخش "35 ©1لاأء01م 5317/6" أنرا ذخيره كنيد.
صفحه 47:
Bere ye
وت
img>Defines an>s.STagPurpose
6 0درج تصویر <51 6111165( << 11130
0 7306 أتعريف م03 ۱۲۳۱8۵96 يا؟؟؟
area>Defines an area inside an>
ورف تفر رت جزووز
map
صفحه 48:
رنك و تصوير زمينه در صفحات اجتمل:
Te yee Te hid elolo) eae) ی
|
(background color) 45 vy 54) vl: bgcolor 4ukt
شناسه 0900101 رنك يس زمينه را تعيين ميكند. مقدار رنك يس زمينه
try ل Wels eure lo) [CMe ل ا ل د كان
و يا حتى مقدار هكزادسيمال (731أع16«<306]) باشد.
body bgcolor="#000000"><body>
»<"bgcolor="rgb(0,0,0)"><body bgcolor="black
تمامی مثالهای بالا با کمک شناسه 06010۲ رنگ زمینه صفحه "سیاه" تعیین
eye)
صفحه 49:
تس رم سر رای زر 0 لكك
ن تصويرى كه به عنوان بس زمينه صفحه نمايش داده ميشود از شناسه 49/010500 63 استفاده
ار این شناسه 11 با آدر س تصویز Sree ee eee Sree Os
باشدء تصوير زمينه تكثير خواهد شد تا حدى كه تمام صفحه نمايش از تصوير زمينه بوشائده شود.
body background="bg.gif"><body>
0 ل aL ا etree ere
reed ا Bie eee ee nie eee re er ses
0.01 باد یک دابركتورى قرار گر در مقابل مثال دوم از أدرس دهى مطلق (ع]05010ق) براى تعيين
أدرس عقاف فده bed Sip SE Geetha es مره تلد از لحان ري ميكل لد 7
1
هرتصويرى با فرمت 911 و يا 00[ قابل استفاده به عنوان تصوير زمينه
به هیچ 100100100
۳
لا
eee icem yen myn
در رژولوشنهای مختلف به دیدن و آزمایش تصاویر پس زمینه بپر
پر مصرف ترین رنگهای زمینه وب سایتهاه رنگهای سفید؛ سیاه و خاکستری میباشند.
آغلب سایتهای وب از تصاویر پس زمینه استفاده نمی کنند! مثلا همین سایت!!1
صفحه 50:
0 ا MIpS IT Erte
XALTOL 5
background s bgcolor uls 4.45 = 53 3
</ا1001> در نسخه *6 اجتمل و 1111/1 يشتيبانى
نميشوند و در واقع از ريده خارج محسوب ميشوند. در
عوض كنسرسيوم 36 /الا استفاده از 517661 ©51[/1 ها
را توصیه میکند و در واقع در نسخه 6 اچتمل و استاندارد
جديد 1/1 111لا تمامى اطلاعات مربوط به نمايش يا
presentation و آنا0لا3| بايد درن style sheet
ها قرار كيرند.
صفحه 51:
<Pou> Si
* در نسخه هاى ©.2 و قبلى تر زبان اجتمل از تك <]8010> براى تعيين نام
قلم» رنگ و اندازه متون استفاده میشود. در ل 0
hi) م ا ا ا لك
eure را ا rece IED)
كد اجتمل نمايش كد روبرو توسط مروركر<"2"- 5126 101 > <م
face="Verdana">This is a
paragraph. </font></p>This is a paragraph. <p
dir: |"><font size="1" face="Times"
Ss) 52 j) 5 Times ab U&<"color="#FF9900
SPs Mil
FF9900 <p di
5 Tahoma ef & Li u!<"face="Tahoma" color="red
اندازه © و رنگ قرمز </0۳<>/۵]>متنی با قلم 13110702 و اندازه
9
صفحه 52:
شناسه های تگ <بم۳(>
size="number"siza-SAttributeExample
وك فار
ا و ل م دا ۱
jal sLS"size="-number"size="-1al4
er ain (1-1 ل
ox—"color="color-value"color="#eeff00.
oue—"color="color-name" color="red.
Ae my eee Tia ا ا ا
اطلاع بوده و استفاده از آنها در طراحى صفحات اجتمل توصيه
نمیشود.
صفحه 53:
eg IPL COPY استفاده نكنيد!
و ی
جهانی تعیین استانداردهای وب (۷۷6 ۷۷۱06 ۷۷۵۲۱۵
oL@ | ,11۳۱ [:20۳50۲)) این تگ را از مجموعه تگهای
استاندارد اجتمل كنار كذاشته است و اكيدا توصيه ميشود كه
ا CaP er Se
نمایشی و آرایشی (۳۳۵56۳۲۵10۳ 6 ]با ۱2۷)
المانها در اچتمل استفاده شود.
صفحه 54:
تگ حوووو>
و روا را(
TOE DWP Wales Nee و ۱
<50/> قرار خواهند گرفت خواص آنرا به ارت
خواهند برد» خواصى از قبيل استيل (©1/ا51) و يا سمت و
ees 0
بر. خلاف تگ های <م > و <0]۷> مرورگرها هیچ سطر
جدیدی به اول یا آخر المان <50۵۲۱> اضافه نمی کنند.
صفحه 55:
مثال:
| کد اچتمل نمایش کد روبرو و کی رون *
style="color:#0000AF;">another text</span> again
..text.,.</p> Some text another text again text
1309 ,03 ,عالان5 ,م11 ,355اء ,10 شناسه «اواستاندارد المان 50310
متالهائى از نحوه استفاده از المان 5030 و غ+©516 56/16 ها:روش قديميروش
ل لال font
styl color: 0
0,255)">Hello!</font><span 0
0,255)">Hello!</span><font ,255) و۲ ارات سفارقة
style="color: Fuchsia">Hello!</font><span
style="color:Fuchsia">Hello!</span><tfont
color="#FFOOFF" size="3">Hello!</font><span
<style="color:#FFOOFF;font-size:100%">Hello!</span
صفحه 56:
ا
1 ا ل reece nee eterna ol | red
تگهای <01۷> و <0[۷/> قرار خوا خواص آترا به ارث خواهند برد» خواصی از
۳0 استيل (©1/ا51) و يا سمت و جهت نمايش
ا ا ا ل اا ا ل ا Pere
كتند.
كه
ات رت لل
style="color: #0000AF;">another text</div> Seely
.text...</p> غ300 ۱ زور۱2 6 textagain text
۳ تا فا dir, Jang
نمایشمتون
Ae is Pen BEES Bry | ا ECON Petey Ce 10
div>Defines a division/section in>1-SStart TagPurpose
که DI ieee ۱0
تا 0 ۱3۱
صفحه 57:
چگونگی استفاده از استایل شیتها:
خش 0620] 1[ فوا اشر
در متال زیر با کمک شتاسه 8۳۵۴ از للدم ی ای میگردد:
BRE ct ea ase aga eco eco ee eee eee
(Chenery PREPS
Semene aireastane erin een
2 بدرد أن صفعه خواهد خورد. در اين حالت بايد #دهائ حاوى تعريف استايل درون
معمولا لتيجه درون بخش 630! صفحه اجتمل كذاشته ميشود.مكال:
ee eee Gee eed ناه ول دم بل وطح "دي لدعا"
ل UIC gL
SE ee renee eee reer ee
ra Cap ae eS ۱۳۳۳
<p style="color: ey ena ل
+ و معا برد و تال طراحی شده Be
ای <عا/ناک> ر <ها/زا5ا> قرار گرفته ر
جر >اردای> <۵ هط
صفحه 58:
ا 0
style>Defines a>a:-SStart TagPurpose ®
Sere emery aad (Mla me Kee len- lala
link>Defines the relationship between>a.
SS VONeN NOE UNDE oer eree= amon fa) تاره
font>Deprecated. Use stylesz.= 4
نار گذلشته شده.از لستایلشیتها لستفادم |50
basefont>Deprecated. Use styles>.s54
عکنار گذلشته شدم.از لستایلشیتها استفادم 0
center>Deprecated. Use styles>.2.+
اک نار گذاشته شدم.از لستایلشیتها لستفادم شود. 0
صفحه 59:
کت را 0
هدف اولیه از طراحی زبان اچتمل ایجاد زبانی برای تعریف اطلاعات محض بدون در
ثيات تَ وات Perc ee nea 000
emer OE Be )0 ا ۱ Align محتواو
نمایش در صفحات اجتمل ادغام گردیده و همین امر سبب بروز مشکلات عدیده ای برای
طراحان و برنامه نویسان re ete Co Nei es PSI ل ee enw)
جداسازی کامل این دو گروء از 0 20
era 0 Wee ty]
ee AE nee een PION 0
میباشده ساختار و محتوا (تگی از نوح پاراگراف با محتوای (‘This is a paragraph"
با اطلاعا نمایش یعنی رنگ و ترازبندی (رنک قرمز متن و ترا ى در وسط ¢
Loin roe ie Sr ae errors
خواهد کرد
"center"><font color="red">This is a>
<paragraph</font></p
صفحه 60:
" كد معادل مثال فوق با استفاده ال استايل شيتها شرح داده
شده است.(هر جند كه اين مثال از تمامى امكانات استايل
شيتها و ايجاد فايلى كاملا مستقل براى تعريف استايل
استفاده نكرده است
صفحه 61:
مدیریت سایت
*-امیدوایم اموزیش-های فوق به شا گمکی کرده باشنه
" با تشكر سينا