پاسخ : آموزش HTML [h=2]تگ های قالب بندی متن[/h] تگ < b > : باعث توپر شدن متنی که درون تگ باز و بسته <b> قرار بگيرد می شود . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] < b > This is Bold Text < /b >[/TD] [TD="class: body"] This is Bold Text[/TD] [/TR] [/TABLE] [HR][/HR] تگ < u > : باعث می شود تا متنی که بين تگ باز و بسته <u> قرار بگيرد ، به صورت خط زير دار نمايش داده شود . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] < u > This is underline Text < /u >[/TD] [TD="class: body"] This is underline Text[/TD] [/TR] [/TABLE] [HR][/HR] تگ < em > , < i > : باعث می شود تا متن درون آن به صورت کج (italic) نماِش داده شود . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] < i > This is italic Text < /i > < em > This is italic Text < /em > [/TD] [TD="class: body"] This is italic Text This is italic Text [/TD] [/TR] [/TABLE] [HR][/HR] تگ < big > : اين تگ باعث نمايش بزرگتر محتويات درون آن نسبت به متن خطوط همجوار می شود . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] My name is < big > Mehrdad < /big > [/TD] [TD="class: body"] My name is Mehrdad [/TD] [/TR] [/TABLE] [HR][/HR] تگ < small > : اين تگ باعث کوچکتر نمايش دادن محتويات درون آن نسبت به متن خطوط همجوار در صفحه می شود . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] My name is < small > Mehrdad < /small >[/TD] [TD="class: body"] My name is Mehrdad[/TD] [/TR] [/TABLE] [HR][/HR] تگ < strong > : اين تگ باعث نمايش توپر و بزرگتر محتويات درون خود نسبت به متن خطوط همجوار آن می شود . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] My name is < strong > Mehrdad < /strong >[/TD] [TD="class: body"] My name is Mehrdad[/TD] [/TR] [/TABLE] [HR][/HR] تگ < cite > : اين تگ باعث نمايش محتويات درون خود به صورت کج و متمايز نسبت به متن خطوط همجوار آن می شود . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] My name is < cite > Mehradad < /cite >[/TD] [TD="class: body"] My name is Mehrdad[/TD] [/TR] [/TABLE] [HR][/HR] تگ < address > : از اين تگ معمولا برای نمايش آدرس ها در صفحه های وب استفاده می شود . خصوصيت مهم تگ address اين است که متن درون خود را به صورت کج (italic) نمايش داده و باعث ايجاد يک خط جديد در ابتدا و انتهای آدرس می شود . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] < address > Washington DC <br / > New York <br / > 214 Ave. < /address > [/TD] [TD="class: body"] Wshington DC New York 214 Ave. [/TD] [/TR] [/TABLE] [HR][/HR] تگ < pre > : چنانچه در محيط کد نويسی صفحات وب ، بين متن های نوشته شده با کليد space فاصله ايجاد کرده یا با کليد Enter به خط بعدی برويد ، مرورگر اين مسئله را ناديده گرفته ، تمام فاصله ها را از بين برده و حداکثر به اندازه يک کاراکتر فاصله ايجاد می کند . برای جلوگيری از اين مسئله ، از تگ <pre> استفاده می کنيم . اين تگ باعث نمايش متن درون خود با همان شکل و ساختاری که در محيط کد نويسی صفحه وارد شده است ، می شود . همانطور که قبلا ذکر شد ، برای ايجاد فاصله بين حروف از کاراکتر ;nbsp& و رفتن به خط بعدی از تگ < br/ > استفاده می کنيم . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] < pre > This is a pre formatted paragraph it does not have any space or linebrake < / pre > [/TD] [TD="class: body"] this is a pre formatted paragraph it does not have any space or linebrake [/TD] [/TR] [TR] [TD="class: body"] < p > this is a usual paragraph IE doesn't pay attention to line brakes and spaces it shows it like this < /p > [/TD] [TD="class: body"] this is a usual paragraph IE doesn't pay attention to line brakes and spaces it shows it like this [/TD] [/TR] [/TABLE]
پاسخ : آموزش HTML [h=2]تگ های کد کامپيوتر[/h] تگ های کد کامپيوتر : از اين گروه تگ برای نمايش نوشته های مورد نظر همانند نمايش در محيط های برنامه نويسی استفاده می شوند . اين حالت برای استفاده در صفحات آموزش کد نويسی و يا شبيه سازی محيط های برنامه نويسی مناسب هستند . تگ < code > : اين تگ نوشته را به صورت نوشته های درون محيط های برنامه نويسی قديمی تبديل می کند . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] < code > This is a sample code < /code > [/TD] [TD="class: body"] This is a sample code [/TD] [/TR] [/TABLE] [HR][/HR] تگ < kbd > : اين تگ نيز حالت خاصی مثل حروف دستگاه تايپ به متن می دهد . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] < kbd > This text is like a type writer < /kbd > [/TD] [TD="class: body"] This text is like a type writer [/TD] [/TR] [/TABLE] [HR][/HR] تگ < samp > : اين تگ نيز حالت خاصی مثل نوشته های درون محيط های برنامه نويسی به متن می دهد . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] < samp > This text is sample text < /samp > [/TD] [TD="class: body"] This text is sample text [/TD] [/TR] [/TABLE] [HR][/HR] تگ < tt > : اين تگ نيز حالت خاصی از نوشته مثل حروف تلگراف به متن می دهد . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] < tt > This text is telegraph text < /tt > [/TD] [TD="class: body"] This text is telegraph text [/TD] [/TR] [/TABLE] [HR][/HR] تگ < var > : اين تگ حالتی برای تعريف متغيرهای برنامه نويسی ايجاد می کند . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی [/TD] [/TR] [TR] [TD="class: body"] < var > This is a variable < /var > [/TD] [TD="class: body"] This is a variable [/TD] [/TR] [/TABLE]
پاسخ : آموزش HTML [h=2]تگ های قالب بندی متن[/h] تگ < sub > , < sup > : از اين تگ ها برای ايجاد نوشته های زير نويس يا انديس دار استفاده می شود . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] This is a text < sub > example < /sub >[/TD] [TD="class: body"] This is a text [SUB]example[/SUB][/TD] [/TR] [TR] [TD="class: body"] This is a text < sup > example < /sup >[/TD] [TD="class: body"] This is a text [SUP]example[/SUP][/TD] [/TR] [/TABLE] [HR][/HR] تگ < abbr > : از اين تگ معمولا برای نمايش يک متن کوتاه و خلاصه شده برای يک واژه يا عبارت بزرگتر استفاده می شود . به طور مثال در انگليسی به جای عبارت et cetra از واژه etc استفاده می کنند . ويژگی مهم تگ < abbr > اين است که می تواند يک مقدار توسط خاصيت title خود گرفته و در هنگام قرار گيری موس بر روی واژه خلاصه شده ، ان نوشته در يک کادر زرد رنگ نمايش دهد . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: prbody, colspan: 2"] موس را برای چند لحظه برروی واژه etc برده و صبر کنيد .[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] < abbr title ="et cetra" > etc < /abbr >[/TD] [TD="class: body"] etc [/TD] [/TR] [/TABLE] [HR][/HR] تگ < acronym > : اين تگ نيز دقيقا عملکردی همانند تگ < abbr > دارد و برای ايجاد يک عنوان مخفف برای يک عبارت بزرگتر استفاده می شود . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: prbody, colspan: 2"] موس را برای چند لحظه برروی واژه WWW برده و صبر کنيد .[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] < acronym title="World Wide Web" > WWW < /acronym > [/TD] [TD="class: body"] WWW[/TD] [/TR] [/TABLE] [HR][/HR] تگ < bdo > : اين تگ مشخص کننده جهت نمايش متن درون خود است . خاصيت dir مشخص کننده جهت نوشته است ، که دو حالت کلی دارد : 1) rtl : راست به چپ 2) ltr : چپ به راست نکته : برای زبان هايي مثل فارسی يا عربی از جهت راست به چپ و برای زبان های مثل انگليسی از جهت چپ به راست استفاده می شود . نکته : از اين تگ ديگر استفاده نمی شود و به جای آن از خاصيت direction در style ها استفاده می شود . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] مثال bdo[/TD] [/TR] [TR] [TD="class: body"] < bdo dir="rtl" > . برای زبان فارسی جهت نوشته بايد از راست به چپ باشد < /bdo > < bdo dir="ltr" > But for english it must be left to right ! < /bdo > [/TD] [TD="class: header"] کد[/TD] [/TR] [TR] [TD="class: body"] برای زبان فارسی جهت نوشته بايد از راست به چپ باشد . But for english it must be left to right ! [/TD] [TD="class: header"] خروجی[/TD] [/TR] [/TABLE]
پاسخ : آموزش HTML [h=2]تگ های قالب بندی متن[/h] تگ < del > : اين تگ باعث کشيده شدن يک خط بر روی نوشته های درون خود می شود . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] This is not correct < del > 2+2=5 < /del >[/TD] [TD="class: body"] This is not correct 2+2=5 [/TD] [/TR] [/TABLE] [HR][/HR] تگ < ins > : اين تگ برای نشان دادن يک متن جديد وارد شده در صفحه به کار می رود و يک خط زير نوشته های درون خود می کشد . [TABLE="class: pr"] [TR] [TD="class: header, colspan: 3"] خواص مهم [/TD] [/TR] [TR] [TD="class: prname"] نام خاصيت [/TD] [TD="class: prname"] نوع خاصيت[/TD] [TD="class: prdes"] شرح[/TD] [/TR] [TR] [TD="class: prbody"] cite[/TD] [TD="class: prbody"] URL مسیر فايل[/TD] [TD="class: prbody"] مشخص کننده پيوند به نقطه ديگری از صفحه است که درباره متن جديد وارد شده توضيحاتی را ارائه می دهد . [/TD] [/TR] [TR] [TD="class: prbody"] datetime[/TD] [TD="class: prbody"] YYYYMMDD تاريخ[/TD] [TD="class: prbody"] تاريخ و ساعت وارد شدن متن جديد را به درون صفحه نمايش می دهد . [/TD] [/TR] [/TABLE] نکته : از ترکيب تگ های <ins > , < del > می توان برای نشان دادن اصلاحات در نوشته های صفحات وب استفاده کرد . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] Our new price is < del > 1000 < /del > < ins > 800 < /ins >[/TD] [TD="class: body"] Our new price is 1000 800[/TD] [/TR] [/TABLE] [HR][/HR] تگ < blockquote > : از اين تگ برای نمايش يک متن يا نوشته به صورت نقل قول استفاده می شود . اين تگ معمولا برای نمايش اطلاغاتی همچون معانی لغت در واژه نامه ها استفاده شده و باعث می شود متن درون آن کمی جلوتر و يک خط پايينتر از بقيه نوشته ها قذرار بگيرد . [TABLE="class: pr"] [TR] [TD="class: header, colspan: 3"] خواص مهم [/TD] [/TR] [TR] [TD="class: prname"] نام خاصيت [/TD] [TD="class: prname"] نوع خاصيت[/TD] [TD="class: prdes"] شرح[/TD] [/TR] [TR] [TD="class: prbody"] cite[/TD] [TD="class: prbody"] URL مسیر فايل[/TD] [TD="class: prbody"] مسير فايل نوشته خلاصه شده را می دهد ، در صورتی که از وب گرفته شده باشد . [/TD] [/TR] [/TABLE] [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] What is an apple ? < blockqute > It is a sweet fruit with red skin < /blockquote > [/TD] [TD="class: body"] What is an apple ? It is a sweet fruit with red skin [/TD] [/TR] [/TABLE] [HR][/HR] < q > : اين تگ نيز همانند تگ < blockquote > برای ايجاد يک نقل قول استفاده می شود با اين تفاوت که حالت اين تگ کوتاه تر بوده و مثل تگ قبلی فاصله ايجاد نمی کند . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] What is an apple ? < q > It is a sweet fruit with red skin < /q >[/TD] [TD="class: body"] What is an apple ? It is a sweet fruit with red skin [/TD] [/TR] [/TABLE]
پاسخ : آموزش HTML [h=2]لينک های HTML[/h] تگ < a > : از لينک ها در HTML ، برای پيوند به يک صفحه ديگر در هر جای وب ، پيوند به نقطه يا مکانی در داخل همان صفحه يا صفحه ديگر و يا يک فايل خارجی مثل عکس ،موسيقی ، فيلم و ... به سند وب استفاده می شود . شکل کلی ايجاد يک پيوند در (HyperLink) در HTML به صورت زير است : < a href="URL" > متن عنوان پيوند < /a > خاصيت href که از نوع URL است برای تعيين مقصد پيوند به کار می رود .اين خاصيت شامل آدرس صفحه يا فايلی است که با کليک بر روی آن پيوند باز خواهد شد . متن عنوان ، متنی است رنگی و خط زير دار که نشان دهنده پيوند است . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: header"] کد[/TD] [TD="class: header"] خروجی[/TD] [/TR] [TR] [TD="class: body"] < a href="http://www.DeveloperStudio.ir/Default.aspx" > Click to visit HomePage < /a > [/TD] [TD="class: body"] Click to visit HomePage [/TD] [/TR] [/TABLE] ايجاد يک لنگر با استفاده از < a > : تعريف لنگر : لنگر نقطه ای از يک صفحه است که با تگ < a > مشخص می شود ، که می توان به وسيله کليک بر روی يک پيوند ، مستقيما به آن نقطه پرش کرد . با استفاده از تگ < a > می توان هر نقطه ای از صفحه را به صورت يک لنگر مشخص کرد و سپس با کليک برروی يک پيوند مستقيما به آن نقطه در صفحه پرش کرد. برای اين منظور در هر نقطه ای از صفحه که می خواهيم به صورت لنگر در بيايد ، يک تگ < a > قرار می دهيم . سپس به وسيله خاصيت Name ، يک نام به آن لنگر اختصاص داده که به اين کار در اصطلاح (Bookmark) می گويند .سپس در خاصيت Href يک پيوند ديگر آدرس لنگر مورد نظر را داده ، که از اين به بعد با کليک بروی آن پيوند ، مستقيما به مکان آن لنگر در صفحه پرش می کنيم . نحوه آدرس دهی درِيک لنگر به صورت زير است : href=" نام لنگر مورد نظر در صفحه # نام صفحه مورد نظر " مثال : < a href="http://www.DeveloperStudio.ir/HTML/Base_Tag1.aspx#ptag > [TABLE="class: pr"] [TR] [TD="class: header, colspan: 3"] خواص مهم [/TD] [/TR] [TR] [TD="class: prname"] نام خاصيت [/TD] [TD="class: prname"] نوع خاصيت[/TD] [TD="class: prdes"] شرح[/TD] [/TR] [TR] [TD="class: prbody"] Charset[/TD] [TD="class: prbody"] Charset - encoding[/TD] [TD="class: prbody"] مشخص کننده نوع کدينگ کاراکترهای صفحه مقصد است . [/TD] [/TR] [TR] [TD="class: prbody"] Coords[/TD] [TD="class: prbody"] [/TD] [TD="class: prbody"] ابتدا به خاصيت shape توجه کنيد . مشخص کننده مختصات نقاط مختلف يک چند ضلعی (مربع ، مستطيل و ... ) برای تعيين قسمتی از يک عکس يا نقشه به عنوان ناحيه ای قابل کليک شدن برای ايجاد پيوند است که دارای حالت های زير است : rect : مربع . تعيين کننده مختصات چهار نقطه مختلف يک مربع يا مستطيل coords =left,top,right,bottom circ : دايره . مشخص کننده نقطه مرکز و شعاع يک دايره coords=center X, center Y ,radius poly : چند ضلعی مشخص کننده مختصات انواع نقاط مختلف يک چند ضلعی coords = X1 Y1, X2 Y2, ... , Xn Yn [/TD] [/TR] [TR] [TD="class: prbody"] href[/TD] [TD="class: prbody"] URL مسير و نام فايل [/TD] [TD="class: prbody"] برای تعيين آدرس کامل صفحه يا فایل مقصد پيوند به کار می رود . [/TD] [/TR] [TR] [TD="class: prbody"] hreflang[/TD] [TD="class: prbody"] language نام زبان[/TD] [TD="class: prbody"] مشخص کننده زبان اصلی و پيش فرض صفحه مقصد پيوند است . [/TD] [/TR] [TR] [TD="class: prbody"] name[/TD] [TD="class: prbody"] text نام منحصر به فرد[/TD] [TD="class: prbody"] برای تعيين يک نام برای ايجاد لنگر به کار می رود . [/TD] [/TR] [TR] [TD="class: prbody"] rel[/TD] [TD="class: prbody"] alternate designates stylesheet start next prev contents index glossary chapter section appendix help bookmark [/TD] [TD="class: prbody"] تعيين کننده نوع ارتباط بين صفحه جاری و صفحه مقصد پيوند است که می تواند يکی از حالت های زير باشد : alternate : يک در ميان designates : انتخاب شده stylesheet : صفحه قالب دهی (CSS) start : ابتدا next : بعدی pre : صفحه قبلی contents : صفحه محتویات index : صفحه آغازين chapter : بخش section : بخشی از برنامه appendix : ضميمه help : صفحه يا فايل راهنما bookmark : يک لنگر در همان صفحه يا صفحه ای ديگر [/TD] [/TR] [TR] [TD="class: prbody"] rev[/TD] [TD="class: prbody"] [/TD] [TD="class: prbody"] تعيين کننده نوع ارتباط بين صفحه مقصد پيوند و صفحه جاری است (بر عکس rel ) و دارای همان مقادير است. [/TD] [/TR] [TR] [TD="class: prbody"] shape[/TD] [TD="class: prbody"] rect rectangle circ circle poly polygon [/TD] [TD="class: prbody"] چنانچه پيوند ناحيه ای از يک عکس يا نقشه تصويری باشد که قابل کليک شدن است ، نوع شکل ناحيه قابل کليک شدن را مشخص می کند ، که مختصات آن توسط خاصيت coords در همين تگ مقدار دهی می شود . انواع اشکال ممکن عبارتند از : rect , rectangle : مربع يا مستطيل circ , circle : دایره يا بيضی poly , polygon : چند ضلعی [/TD] [/TR] [TR] [TD="class: prbody"] target[/TD] [TD="class: prbody"] _blank _parent _self _top [/TD] [TD="class: prbody"] نحوه باز شدن و نمايش پنجره صفحه مقصد را تعيين می کند که دارای حالت های زير است : - blank : لينک در يک پنجره جديد باز خواهد شد . - self : لينک در همان پنجره يا قابی که کليک شده است باز خواهد شد . -parent : لينک در قاب اصلی يا مادر باز خواهد شد . -top : لينک در همان پنجره ای که کليک شده است به طور کامل باز خواهد شد . [/TD] [/TR] [/TABLE]
پاسخ : آموزش HTML [h=2]لينک های HTML[/h] تگ < link > : تگ لينک برای برقراری ارتباط بين صفحه جاری و يک صفحه يا فايل خارجی مورد استفاده قرار می گيرد . تگ لينک تگ پايانی ندارد و با علامت / در همان تگ ابتدايی بسسته می شود .اين تگ می تواند به دفعات دلخواه و برای مقاصد مختلف ، در قسمت Head مورد استفاده قرار بگيرد . برای مثال از تگ link می توان برای اتصال صفحه به يک فايل قالب دهی ( Style Sheet CSS ) ، فايل حاوی دستورات اسکريپتی مثل js و ... استفاده کرد . مثال : استفاده از تگ لينک برای برقراری ارتباط بين صفحه جاری و يک فايل CSS : < head > < link rel ="Stylesheet" type ="text/css" href="../themes.css" / > < /head > [TABLE="class: pr"] [TR] [TD="class: prname"] نام خاصيت[/TD] [TD="class: prname"] نوع خاصيت[/TD] [TD="class: prdes"] شرح [/TD] [/TR] [TR] [TD="class: prbody"] charset[/TD] [TD="class: prbody"] charset[/TD] [TD="class: prbody"] شيوه و متد کدينگ صفحه مقصد پيوند را مشخص می کند .[/TD] [/TR] [TR] [TD="class: prbody"] href[/TD] [TD="class: prbody"] URL[/TD] [TD="class: prbody"] آدرس کامل اينترنتی صفحه يا فايل مقصد پيوند را تعيين می کند .[/TD] [/TR] [TR] [TD="class: prbody"] hreflang[/TD] [TD="class: prbody"] نام زبان language[/TD] [TD="class: prbody"] زبان پيش فرض و پايه صفحه مقصد پيوند را مشخص می کند .[/TD] [/TR] [TR] [TD="class: prbody"] media[/TD] [TD="class: prbody"] screen tty ty projection handheld print braille auarl all[/TD] [TD="class: prbody"] مشخص کننده نوع وسيله ای است که قرار است صفحه مقصد پيوند را نمايش دهد که ذکر آن آن در اين قسمت برای کمک به مرورگر برای اعمال تنظيمات متناسب با نوع خروجی است ، که می تواند انواع حالات زير را داشته باشد : screen : صفحه نمايش کامپيوترهای معمولی . tty : ماشين تحرير راه دور ، تله تايپ ( برای ماشين هايی که دارای نحوه نمايش ثابت هستند ) . tv : وسايلی همچون تلويزيون با رزوليشن پايين . projection : برای نمايش در پروژکتورها . handheld : برای کامپيوتر های دستی و جيبی . barille : در اسناد مخصوص به افراد نابينا ( بريل ) . print : برای پرينت در دستگاه های چاپگر . auarl : برای سيستم های صوتی . all : برای همه نوع سيستم ها . [/TD] [/TR] [TR] [TD="class: prbody"] rel[/TD] [TD="class: prbody"] alternate designates stylesheet start next prev contents index glossary chapter section appendix help bookmark [/TD] [TD="class: prbody"] تعيين کننده نوع ارتباط بين صفحه جاری و صفحه مقصد پيوند است که می تواند يکی از حالت های زير باشد : alternate : يک در ميان designates : انتخاب شده stylesheet : صفحه قالب دهی (CSS) start : ابتدا next : بعدی pre : صفحه قبلی contents : صفحه محتویات index : صفحه آغازين chapter : بخش section : بخشی از برنامه appendix : ضميمه help : صفحه يا فايل راهنما bookmark : يک لنگر در همان صفحه يا صفحه ای ديگر [/TD] [/TR] [TR] [TD="class: prbody"] rev[/TD] [TD="class: prbody"] [/TD] [TD="class: prbody"] تعيين کننده نوع ارتباط بين صفحه مقصد پيوند و صفحه جاری است (بر عکس rel ) و دارای همان مقادير است. [/TD] [/TR] [TR] [TD="class: prbody"] target[/TD] [TD="class: prbody"] _blank _parent _self _top [/TD] [TD="class: prbody"] نحوه باز شدن و نمايش پنجره صفحه مقصد را تعيين می کند که دارای حالت های زير است: - blank : لينک در يک پنجره جديد باز خواهد شد . - self : لينک در همان پنجره يا قابی که کليک شده است باز خواهد شد . -parent : لينک در قاب اصلی يا مادر باز خواهد شد . -top : لينک در همان پنجره ای که کليک شده است به طور کامل باز خواهد شد . [/TD] [/TR] [TR] [TD="class: prbody"] type[/TD] [TD="class: prbody"] MIME_Type text/css text/javascript text/vbscript text/asp text/xml images/gif [/TD] [TD="class: prbody"] نوع MIME صفحه يا فايل مقصد را مشخص می کند که چند حالت آن عبارتند از : text/css : از نوع متن و برای استفاده در صفحات قالب دهی به صفحات CSS . text/javascript : از نوع متن و حاوی دستورات اسکريپتی نوشته شده با زبان javascript . text/vbscript : از نوع متن و حاوی دستورات اسکريپتی نوشته شده با زبان vbscript . text/asp : از نوع متن و حاوی صفحه اينترنتی نوشته شده با زبان ASP . text/xml : از نوع متن و حاوی دستورات اسکريپتی نوشته شده با زبان XML . image/gif : از نوع تصوير و با پسوند gif . [/TD] [/TR] [/TABLE]
پاسخ : آموزش HTML [h=2]لينک های HTML[/h] تگ < Object > : اين تگ برای پيوند يک شی خارجی ( مثل فايل های صوتی ، تصويری ، انواع فايل های برنامه و ... ) به صفحه HTML استفاده می شود . اين تگ به برنامه نويس اجازه می دهد که اطلاعات و پارامترهای لازم را برای عناصر وارد شده به صفحه HTML تعيين کرده و کد مورد نظر را برای نمايش و مديريت استفاده از فايل در صفحه درج نمايد . اين اطلاعات پيش گفته به مرورگر در نمايش بهتر شی خارجی کمک می کند . تگ < param > در درون اين تگ به دفعات دلخواه می تواند استفاده شود که تعيين کننده تنظيمات نمايش شی در هنگام اجرا است . نکته : يک تگ < object > هم می تواند در قسمت < head > و هم در قسمت < body > قرار بگيرد . متنی که که بين تگ باز و بسته < object > قرار بگيرد ، به عنوان يک متن هشدار دهنده در مرورگرهای قديمی که اين تگ را پشتيبانی نمی کنند ، به جای شی مورد نظر نمايش داده خواهد شد . نکته : برای نمايش تصاوير از تگ < img > به جای < object > استفاده می شود . [TABLE="class: pr"] [TR] [TD="class: prname"] نام خاصيت [/TD] [TD="class: prname"] نوع خاصيت [/TD] [TD="class: prdes"] شرح [/TD] [/TR] [TR] [TD="class: prbody"] archive [/TD] [TD="class: prbody"] URL [/TD] [TD="class: prbody"] يک ليست از تعدای URL است که نگهدارنده منابع و فايل های مربوط به تگ < object > مورد نظر است . [/TD] [/TR] [TR] [TD="class: prbody"] align [/TD] [TD="class: prbody"] left right top bottom [/TD] [TD="class: prbody"] تراز بندی قرار گيری متن را به دور شی مورد نظر تعيين می کند که می تواند حالت های زير را داشته باشد : left : چپ right : راست top : بالا bottom : پايين [/TD] [/TR] [TR] [TD="class: prbody"] border [/TD] [TD="class: prbody"] pixels [/TD] [TD="class: prbody"] تعيين کننده يک حاشيه به دور شی است . [/TD] [/TR] [TR] [TD="class: prbody"] ClassID [/TD] [TD="class: prbody"] رده کلاس شی Class ID [/TD] [TD="class: prbody"] مشخصئ کننده Class ID برای شی مورد نظر است که در تنظيمات رجيستری ويندوز و یا در يک URL است . [/TD] [/TR] [TR] [TD="class: prbody"] data [/TD] [TD="class: prbody"] URL [/TD] [TD="class: prbody"] مسير کامل محل نگهداری اطلاعات تگ < object > مورد نظر را مشخص می کند . [/TD] [/TR] [TR] [TD="class: prbody"] declare [/TD] [TD="class: prbody"] declare [/TD] [TD="class: prbody"] درصورتی که مقدار اين خاصيت برابر declare تنظيم شود ، مشخص می کند که فايل فقط بايد معرفی شود و تا زمانی که نياز نيست ايجاد يا نصب نشود . [/TD] [/TR] [TR] [TD="class: prbody"] height [/TD] [TD="class: prbody"] pixels % درصد [/TD] [TD="class: prbody"] ارتفاع شی را تعيين می کند . [/TD] [/TR] [TR] [TD="class: prbody"] hsapce [/TD] [TD="class: prbody"] pixels [/TD] [TD="class: prbody"] مشخص کننده يک فاصله خالی افقی به دور شی مورد نظر است . [/TD] [/TR] [TR] [TD="class: prbody"] name [/TD] [TD="class: prbody"] unique name نام [/TD] [TD="class: prbody"] نام منحصر به فرد را برای شی تعيين می کند . [/TD] [/TR] [TR] [TD="class: prbody"] stand by [/TD] [TD="class: prbody"] text [/TD] [TD="class: prbody"] يک متن پيش فرض است که در مدت زمانی که فايل در حال لود شدن است ، به جای شی مورد نظر نمايش داده می شود . [/TD] [/TR] [TR] [TD="class: prbody"] type [/TD] [TD="class: prbody"] MIME_type [/TD] [TD="class: prbody"] نوع MIME داده ای شی را تعيين می کند . در اين مورد در تگ link توضيح داده شده است . [/TD] [/TR] [TR] [TD="class: prbody"] usemap [/TD] [TD="class: prbody"] URL [/TD] [TD="class: prbody"] مشخص کننده مسير کامل يک فايل يا نقشه تصويری بر روی کامپيوتر Client است که بايد همراه با شی مورد نظر استفاده شود . [/TD] [/TR] [TR] [TD="class: prbody"] vspace [/TD] [TD="class: prbody"] pixels [/TD] [TD="class: prbody"] مشخص کننده يک فاصله خالی عمودی ( از بالا و پايين ) به دور شی است . [/TD] [/TR] [/TABLE] [HR][/HR] تگ < param > : اين تگ تنظيمات زمان اجرای برنامه را برای استفاده از شی وارد شده در صفحه تعيين می کند . اين تگ به دفعات مورد نياز ( هر بار برای تعيين مقدار يک تنظيم يا خاصيت ) بايد در درون تگ object استقاده شود . [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] مثال [/TD] [/TR] [TR] [TD="class: body, colspan: 2, align: center"] منبع مثال : www.w3schools.com\tags\tag_param.aspx [/TD] [/TR] [TR] [TD="class: header"] کد [/TD] [TD="class: header"] خروجی [/TD] [/TR] [TR] [TD="class: body"] < object classid="clsid:F08DF954-8592-11D1-B16A-00C0F0283628" id="Slider1" width="100" height="50" > < param name="BorderStyle" value="1" /> < param name="MousePointer" value="0" /> < param name="Enabled" value="1" /> < param name="Min" value="0" /> < param name="Max" value="10" /> < /object > [/TD] [TD="class: body"] [/TD] [/TR] [/TABLE] [TABLE="class: pr"] [TR] [TD="class: prname"] نام خاصيت [/TD] [TD="class: prname"] نوع خاصيت [/TD] [TD="class: prdes"] شرح [/TD] [/TR] [TR] [TD="class: prbody"] name [/TD] [TD="class: prbody"] unique name نام [/TD] [TD="class: prbody"] يک نام منحصر به فرد برای پارامتر تعيين می کند . [/TD] [/TR] [TR] [TD="class: prbody"] type [/TD] [TD="class: prbody"] MIME-type [/TD] [TD="class: prbody"] نوع فايل MIME شی را در اينترنت مشخص می کند . [/TD] [/TR] [TR] [TD="class: prbody"] value [/TD] [TD="class: prbody"] value مقدار [/TD] [TD="class: prbody"] يک مقدار و ارزش برای پارامتر تعيين می کند . [/TD] [/TR] [TR] [TD="class: prbody"] value type [/TD] [TD="class: prbody"] data ref object [/TD] [TD="class: prbody"] نوع داده ای شی را تعيين می کند که می تواند حالت های زير را داشته باشد : - data : - ref : - object : [/TD] [/TR] [/TABLE]
پاسخ : آموزش HTML [h=2]جدول های HTML[/h] تگ جدول < table > : اين تگ برای ايجاد جدول ها در صفحه استفاده می شود . به طور کلی جدول ها به 2 منظور ايجاد می شوند : ايجاد يک جدول معمولی با تعدادی خانه ، برای نمايش مطالب مورد نظر در سطرها و ستون های جدا از هم . تقسيم فضای صفحه با استفاده از چهارچوب جدول ها برای منظم چيدن محتويات صفحه . به طور مثال مطالب اين صفحه در تعدادی خانه جدول مرتب شده است . در اين حالت می توان با عدم تعيين حاشيه ( border ) برای خانه های جدول ، از چهارچوب جدول ها استفاده کرد در حالی که آنها عملا از ديد کاربر مخفی هستند . جدول ها برای هر منظوری به کار روند ، بايد با استفاده از تگ < table > ايجاد شوند . هر جدول مجموعه ای از سطرها و ستون هاست . برای ايجاد يک سطر جديد از يک تگ < tr > استفاده می شود که هر خانه ( ستون ) درون سطر هم توسط يک تگ < td > مشخص می شود . [h=3]الگوريتم طراحی جدول :[/h] در طراحی جدول بايد به نکات زير دقت کرد : در هنگام ايجاد يک سطر یا استفاده از تگ < tr > ، قبل از ايجاد سطر جديد حتما بايد تگ < tr > قبلی بسته شود و در هر سطر نيز بايد در صورت ايجاد هر خانه با تگ < td > قبل از ايجاد يک خانه جديد بايد تگ < td > قبلی بسته شود . درون تگ < table > فقط می توان تگ < tr > و درون تگ < tr > نيز فقط می توان از تگ < td > استفاده کرد . خانه هاو سطرهای يک جدول منظم و مرتب هستند . به عبارت ديگر به طور مثال نمی توان در يک سطر جدول 3 خانه و در سطر پايينی آن 2 خانه با پهناهای متفاوت ايجاد کرد . در چنين مواردی بايد با استفاده از خاصيت colspan در تگ < td > سطر با خانه کمتر و استفاده از تکنيک جدول های تو در تو اين مسئله را بر طرف کرد . جدول های تو در تو : می توان در درون يک جدول ، جدول های ديگری نيز ايجاد کرد . در اين حالت جدول درونی همانند يک خانه جدول بيرونی خواهد بود . جدول درونی را بايد در يک تگ < td > جدول بيرونی ايجاد کرد . در اين حالت چيدمان خانه های جدول درونی به چيدمان خانه های جدول بيرونی ارتباطی ندارند . مثال : تمام موارد ذکر شده را در مثال زير بررسی می کنيم : [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] مثال [/TD] [/TR] [TR] [TD="class: body"] < table cellpadding ="5" cellspacing ="0" style ="border :solid 2px blue; width:100%" > < tr > < td class ="header" colspan ="2" > Header < /td > < /tr > < tr > < td class ="body" > Body 1 < /td > < td class="body" > Body 2 < /td > < /tr > < tr > < td class ="body" colspan ="2" style ="padding :0" > < table cellpadding ="5" cellspacing="0" style ="width :100% " > < tr > < td style ="border :solid 1px green " > C1 < /td > < td style ="border :solid 1px green " > C2 < /td > < td style ="border :solid 1px green " > C3 < /td > < /tr > < tr > < td style ="border :solid 1px green " > C4 < /td > < td style ="border :solid 1px green " > C5 < /td > < td style ="border :solid 1px green " > C6 < /td > < /tr > < /table > < /td > < /tr > < /table > [/TD] [TD="class: header"] کد [/TD] [/TR] [TR] [TD="class: body"] [TABLE="width: 100%"] [TR] [TD="class: header, colspan: 2"] Header [/TD] [/TR] [TR] [TD="class: body"] Body 1 [/TD] [TD="class: body"] Body 2 [/TD] [/TR] [TR] [TD="class: body, colspan: 2"] [TABLE="width: 100%"] [TR] [TD] C1 [/TD] [TD] C2 [/TD] [TD] C3 [/TD] [/TR] [TR] [TD] C4 [/TD] [TD] C5 [/TD] [TD] C6 [/TD] [/TR] [/TABLE] [/TD] [/TR] [/TABLE] [/TD] [TD="class: header"] خروجی [/TD] [/TR] [TR] [TD="class: body, align: right"] 1) سطر دوم جدول بيرونی دارای يک خانه و سطر دوم دارای دو خانه است . نتظيم خاصيت colspan = 2 در سطر اول باعث می شود تا بين سطر اول و دوم هماهنگی ايجاد شده و تک خانه سطر اول کش آمده و دو خانه سطر دوم را پوشش بدهد . 2) نوشتن متن فقط درون تگ باز و بسته td مجاز است . 3) سطر سوم ( سومين تگ tr ) محدوده جدول درونی را مشخص می کند ، که بخش کدهای سبز را شامل می شود . 4) به جدول هم می توان در بخش style و هم در داخل تگ table ، حاشيه border داد . حاشيه ای که در قسمت style تعيين شود فقط باعث نمايش خطوط دور جدول می شود و خطوط درونی را شامل نمی شود . اما حاشيه تعيين شده در تگ table باعث نمايش خطوط بيرونی و درونی جدول می شود . همچنين می توان به هر td به صورت مجزا حاشيه اختصاص داد . [/TD] [TD="class: header"] توضيحات [/TD] [/TR] [/TABLE] [TABLE="class: pr"] [TR] [TD="class: header, colspan: 3"] خصوصيات تگ Table [/TD] [/TR] [TR] [TD="class: prname"] نام خاصيت [/TD] [TD="class: prname"] نوع خاصيت [/TD] [TD="class: prdes"] شرح [/TD] [/TR] [TR] [TD="class: prbody"] align [/TD] [TD="class: prbody"] left right center [/TD] [TD="class: prbody"] نحوه ترازبندی و قرار گيری جدول را در صفحه مشخص می کند که 3 حالت دارد : 1) left : چپ 2) right : راست 3) center : وسط [/TD] [/TR] [TR] [TD="class: prbody"] bgcolor [/TD] [TD="class: prbody"] نام رنگ color name [/TD] [TD="class: prbody"] رنگ پس زمينه جدول را تعيين می کند . [/TD] [/TR] [TR] [TD="class: prbody"] border [/TD] [TD="class: prbody"] pixel [/TD] [TD="class: prbody"] ضخامت و پهنای خطوط حاشيه دور جدول را تعيين می کند . [/TD] [/TR] [TR] [TD="class: prbody"] cellpadding [/TD] [TD="class: prbody"] pixel [/TD] [TD="class: prbody"] ميزان فاصله بين خطوط حاشيه جدول و محتويات دورن خانه های درون آن را تعيين می کند . [/TD] [/TR] [TR] [TD="class: prbody"] cellspacing [/TD] [TD="class: prbody"] pixel [/TD] [TD="class: prbody"] فاصله بين خانه های جدول را تعيين می کند . در صورتی که مقدار اين خاصيت صفر باشد ، خانه های جدول به هم می چسبند . [/TD] [/TR] [TR] [TD="class: prbody"] frame [/TD] [TD="class: prbody"] above below border box hsides lhs rhs vsides [/TD] [TD="class: prbody"] مشخص می کند که کدام قسمت از خطوط حاشيه های جدول بايد نمايش داده شوند که می تواند يکی از حالت های زير را داشته باشد : - above : خطوط بالايي جدول نمايش داده خواهند شد . - below : خطوط پايينی جدول نمايش داده خواهند شد . - border : کليه خطوط حاشيه های خانه های جدول نمايش داده خواهند شد . - box : کليه خطوط حاشيه خانه های جدول نمايش داده خواهند شد . - hsides : فقط خطوط افقی حاشيه خانه های جدول نمايش داده خواهند شد . - lhs : فقط خطوط افقی سمت چپ حاشيه خانه های جدول نمايش داده خواهند شد . - rhs : فقط خطوط افقی سمت راست حاشيه خانه های جدول نمايش داده خواهند شد . - vsides : فقط خطوط عمودی حاشيه خانه های جدول نمايش داده خواهند شد . - void : هيچ کدام از خطوط حاشيه های خانه های جدول نمايش داده خواهند شد . [/TD] [/TR] [TR] [TD="class: prbody"] rules [/TD] [TD="class: prbody"] cols rows group all [/TD] [TD="class: prbody"] مشخص کننده نوع و حالت خطوط تقسيم کننده خانه های جدول به خانه های کوچکتر است که انواع ممکن آن عبارتند از : - cols : خانه های جدول فقط بر حسب ستون ها با خطوط از هم جدا می شوند . - rows : خانه های جدول فقط بر حسب سطرها با خطوط از هم جدا می شوند . - group : خانه های جدول بر حسب گروه بندی داخلی در جدول با خطوط از هم جدا می شوند . - all : تمام خانه های جدول با خطوط عمودی و افقی از هم جدا می شوند . [/TD] [/TR] [TR] [TD="class: prbody"] summary [/TD] [TD="class: prbody"] text [/TD] [TD="class: prbody"] يک متن خلاصه در مورد جدول است که برای برخی مرورگرهای صوتی يا بدون تصوير استفاده می شود . [/TD] [/TR] [TR] [TD="class: prbody"] width [/TD] [TD="class: prbody"] pixel % درصد [/TD] [TD="class: prbody"] ميزان پهنا و عرض جدول را تعيين می کند . [/TD] [/TR] [/TABLE] [HR][/HR]
پاسخ : آموزش HTML [h=2]جدول های HTML[/h] تگ < tr > : از اين تگ برای ايجاد يک سطر در جدول استفاده می شود . در درون هر سطر به تعداد دلخواه می توان ستون ( خانه جدول ) به وسيله تگ < td > ، ايجاد کرد . نکته : از تگ < tr > فقط برای ايجاد يک سطر و نه خانه جدول استفاده می شود . تگ < tr > ، بدون تگ < td > در درون آن خروجی ندارد . [TABLE="class: pr"] [TR] [TD="class: header, colspan: 3"] خصوصيات تگ Tr[/TD] [/TR] [TR] [TD="class: prname"] نام خاصيت[/TD] [TD="class: prname"] نوع خاصيت[/TD] [TD="class: prdes"] شرح [/TD] [/TR] [TR] [TD="class: prbody"] align[/TD] [TD="class: prbody"] left right center Justify Char[/TD] [TD="class: prbody"] نحوه ترازبندی و قرار گيری محتويات درون سطر جدول را مشخص می کند که 5 حالت دارد : 1) left : چپ 2) right : راست 3) center : وسط 4) Justify : در کل عرض شی گسترش داده می شود . 5) Char : ترازبندی با توجه به يک کاراکتر خاص تعيين می شود . [/TD] [/TR] [TR] [TD="class: prbody"] bgcolor[/TD] [TD="class: prbody"] نام رنگ color name[/TD] [TD="class: prbody"] رنگ پس زمينه خانه های سطر را تعيين می کند . [/TD] [/TR] [TR] [TD="class: prbody"] char[/TD] [TD="class: prbody"] کاراکتر Character[/TD] [TD="class: prbody"] کاراکتری که قرار است متن دورن سطر حول آن تراز شود را تعيين می کند . توجه : فقط در صورتی کاربرد دارد که خاصيت Align روی مقدار Char تنظيم شده باشد . [/TD] [/TR] [TR] [TD="class: prbody"] charoff[/TD] [TD="class: prbody"] Pixel درصد %[/TD] [TD="class: prbody"] میزان حاشيه ای که به کاراکتر اول متن اختصاص داده می شود ، تا متن درون سطر را تراز کند . توجه : فقط در صورتی کاربرد دارد که خاصيت Align روی مقدار Char تنظيم شده باشد . [/TD] [/TR] [TR] [TD="class: prbody"] valign[/TD] [TD="class: prbody"] top bottom middle baseline [/TD] [TD="class: prbody"] نحوه ترازبندی عمودی محتويات درون سطر جدول را تعيين می کند . - top : محتوِيات دورن خانه جدول از بالا تراز می شوند . - bottom : محتوِيات دورن خانه جدول از وسط خانه جدول تراز می شوند . - middle : محتوِيات دورن خانه جدول از پايين خانه جدول تراز می شوند . [/TD] [/TR] [/TABLE] مثال : ايجاد يک جدول با دو سطر : [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example [/TD] [/TR] [TR] [TD="class: body"] < table width = "400px" border = "1" > < tr > < td > سطر 1 < /td > < /tr > < tr > < td > سطر 2 < /td > < /tr > < /table > [/TD] [TD="class: header"] کد[/TD] [/TR] [TR] [TD="class: body, align: center"] [TABLE="width: 400"] [TR] [TD] سطر 1[/TD] [/TR] [TR] [TD] سطر 2[/TD] [/TR] [/TABLE] [/TD] [TD="class: header"] خروجی[/TD] [/TR] [/TABLE] [HR][/HR]
پاسخ : آموزش HTML [h=2]جدول های HTML[/h] تگ < Td > : از تگ < td > برای ايجاد يک خانه جدول درون يک سطر ( تگ tr ) استفاده می شود . هر خانه جدول می تواند خصوصيات منحصر به فرد و ويژه خود را داشته باشد . نکته : تگ < td > فقط بايد درون تگ < tr > استفاده شود . [TABLE="class: pr"] [TR] [TD="class: header, colspan: 3"] خصوصيات تگ Td[/TD] [/TR] [TR] [TD="class: prname"] نام خاصيت[/TD] [TD="class: prname"] نوع خاصيت[/TD] [TD="class: prdes"] شرح [/TD] [/TR] [TR] [TD="class: prbody"] abbr[/TD] [TD="class: prbody"] متن Text[/TD] [TD="class: prbody"] با استفاده از اين خاصيت می توان يک عبارت خلاصه شده در مورد محتويات خانه جدول تعيين کرد . [/TD] [/TR] [TR] [TD="class: prbody"] align[/TD] [TD="class: prbody"] left right center Justify Char[/TD] [TD="class: prbody"] نحوه ترازبندی و قرار گيری محتويات درون خانه جدول را مشخص می کند که 5 حالت دارد : 1) left : چپ 2) right : راست 3) center : وسط 4) Justify : در کل عرض شی گسترش داده می شود . 5) Char : ترازبندی با توجه به يک کاراکتر خاص تعيين می شود . [/TD] [/TR] [TR] [TD="class: prbody"] axis[/TD] [TD="class: prbody"] نام Text[/TD] [TD="class: prbody"] يک نام را برای خانه جدول تعيين می کند . [/TD] [/TR] [TR] [TD="class: prbody"] bgcolor[/TD] [TD="class: prbody"] نام رنگ color name[/TD] [TD="class: prbody"] رنگ پس زمينه خانه جدول را تعيين می کند . [/TD] [/TR] [TR] [TD="class: prbody"] char[/TD] [TD="class: prbody"] کاراکتر Character[/TD] [TD="class: prbody"] کاراکتری که قرار است متن دورن خانه جدول حول آن تراز شود را تعيين می کند . توجه : فقط در صورتی کاربرد دارد که خاصيت Align روی مقدار Char تنظيم شده باشد . [/TD] [/TR] [TR] [TD="class: prbody"] charoff[/TD] [TD="class: prbody"] Pixel درصد %[/TD] [TD="class: prbody"] میزان حاشيه ای که به کاراکتر اول متن اختصاص داده می شود ، تا متن درون خانه جدول را تراز کند . توجه : فقط در صورتی کاربرد دارد که خاصيت Align روی مقدار Char تنظيم شده باشد . [/TD] [/TR] [TR] [TD="class: prbody"] colspan[/TD] [TD="class: prbody"] عدد Number[/TD] [TD="class: prbody"] تعداد خانه های که اين خانه جدول آنها را پوشش می دهد را تعيين می کند . برای درک بهتر به مثال پايين صفحه توجه کنيد .[SUP]*[/SUP] [/TD] [/TR] [TR] [TD="class: prbody"] height[/TD] [TD="class: prbody"] pixel [/TD] [TD="class: prbody"] میزان ارتفاع خانه جدول را تعيين می کند . اين خاصيت قديمی شده و به جای آن از CSS استفاده می شود . [/TD] [/TR] [TR] [TD="class: prbody"] nowrap[/TD] [TD="class: prbody"] nowrap [/TD] [TD="class: prbody"] تعيين می کند که اگر پهنای خانه جدول از پهنای متن درون آن کمتر بود ، خطوط متن شکسته شده و برای هم اندازه شدن با پهنای خانه جدول به بخش های کوچکتر تقسيم شوند يا خير . اين خاصيت قديمی شده و به جای آن از CSS استفاده می شود . [/TD] [/TR] [TR] [TD="class: prbody"] rowspan[/TD] [TD="class: prbody"] عدد Number[/TD] [TD="class: prbody"] تعداد سطرهايی که اين خانه جدول آنها را پوشش می دهد را تعيين می کند . برای درک بهتر به مثال پايين صفحه توجه کنيد .[SUP]*[/SUP] [/TD] [/TR] [TR] [TD="class: prbody"] scope [/TD] [TD="class: prbody"] Col Colgroup Row Rowgroup[/TD] [TD="class: prbody"] مشخص می کند که اين خانه جدول اطلاعاتی را راجع به بقيه سطری که آن را در برگرفته ( Row ) ، يا بقيه ستونی که اين خانه جز آن است ( Col ) ، يا گروه سطرهايی که آن خانه را در بر گرفته اند ( Rowgroup ) و يا گروه ستون هايی که اين خانه جزء آن است ( Colgroup ) شامل می شود . [/TD] [/TR] [TR] [TD="class: prbody"] valign[/TD] [TD="class: prbody"] top bottom middle baseline [/TD] [TD="class: prbody"] نحوه ترازبندی عمودی محتويات درون خانه جدول را تعيين می کند . - top : محتوِيات دورن خانه جدول از بالا تراز می شوند . - bottom : محتوِيات دورن خانه جدول از وسط خانه جدول تراز می شوند . - middle : محتوِيات دورن خانه جدول از پايين خانه جدول تراز می شوند . [/TD] [/TR] [TR] [TD="class: prbody"] width[/TD] [TD="class: prbody"] pixel % درصد [/TD] [TD="class: prbody"] ميزان پهنا و عرض جدول را تعيين می کند . [/TD] [/TR] [/TABLE] در مثال های زير برخی از خصوصيات مهم و پر کاربرد معرفی شده جدول بالا را در عمل نشان می دهيم : [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example [/TD] [/TR] [TR] [TD="class: body"] < table width = "500px" border = "1" > < tr > < td width = "200px" align = "left" height = "100px" valign = "top" bgcolor = "blue" > Cell 1 < /td > < td width = "300px" align = "center" valign = "bottom" bgcolor = "green" > Cell 2 < /td > < /tr > < /table > [/TD] [TD="class: header"] کد[/TD] [/TR] [TR] [TD="class: body"] [TABLE="width: 400"] [TR] [TD="width: 200px, bgcolor: blue, align: left"] Cell 1[/TD] [TD="width: 300px, bgcolor: green, align: center"] Cell 2[/TD] [/TR] [/TABLE] [/TD] [TD="class: header"] خروجی[/TD] [/TR] [/TABLE] [HR][/HR] - خاصيت colspan و rowspan : قبلا اشاره کرديم که خانه های جدول مرتب هستند و دارای ساختار مرتبط به هم . برای مثال نمی توان در يک سطر جدول 1 خانه و در سطر پايينی 3 خانه داشت . در چنين شرايطی از خاصيت colspan در سطر با خانه کمتر استفاده می کنيم تا سطری که خانه کمتر دارد ، سطر با خانه بيشتر را پوشش دهد . خاصيت colspan برای پوشش افقی خانه ها و خاصيت rowspan برای پوشش عمودی خانه های جدول به کار می رود . به مثال های زير توجه کنيد : [TABLE="class: ex"] [TR] [TD="class: header, colspan: 3"] Example[/TD] [/TR] [TR] [TD="class: body"] < table width = "450px" border = "1" > < tr > < td width = "450px" > Cell 1 < /td > < /tr > < tr > < td width = "150px" > Cell 2 < /td > < td width = "150px" > Cell 3 < /td > < td width = "150px" > Cell 4 < /td > < /tr > < /table > [/TD] [TD="class: header"] کد بدون خاصيت colspan[/TD] [/TR] [TR] [TD="class: body"] [TABLE] [TR] [TD="width: 450px"] Cell 1 [/TD] [/TR] [TR] [TD="width: 150px"] Cell 2[/TD] [TD="width: 150px"] Cell 3[/TD] [TD="width: 150px"] Cell 4[/TD] [/TR] [/TABLE] [/TD] [TD="class: header"] خروجی کد بدون خاصيت colspan[/TD] [/TR] [TR] [TD="class: body, align: right"] می بينيم بدون استفاده از خاصيت colspan در سطر با خانه کمتر ، عملا جدول به هم ريخته بوده و خروجی درستی ندارد . در قسمت زير با اضافه کردن خاصيت colspan به خروجی درست می رسيم . [/TD] [TD="class: header"] توجه ![/TD] [/TR] [TR] [TD="class: body"] < table width = "450px" border = "1" > < tr > < td width = "450px" colspn = "3" > Cell 1 < /td > < /tr > < tr > < td width = "150px" > Cell 2 < /td > < td width = "150px" > Cell 3 < /td > < td width = "150px" > Cell 4 < /td > < /tr > < /table > [/TD] [TD="class: header"] کد با خاصيت colspan [/TD] [/TR] [TR] [TD="class: body"] [TABLE] [TR] [TD="width: 450px, colspan: 3"] Cell 1 [/TD] [/TR] [TR] [TD="width: 150px"] Cell 2[/TD] [TD="width: 150px"] Cell 3[/TD] [TD="width: 150px"] Cell 4[/TD] [/TR] [/TABLE] [/TD] [TD="class: header"] خروجی کد با خاصيت colspan [/TD] [/TR] [/TABLE] - خاصيت rowspan : مثال : حالت فوق را درباره 2 ستون با تعداد سطرهای متفاوت نشان می دهيم : [TABLE="class: ex"] [TR] [TD="class: header, colspan: 2"] Example[/TD] [/TR] [TR] [TD="class: body"] < table width="450px" border="1" > < tr > < td width="450px" > Cell 1 < /td > < td width="150px" > Cell 2 < /td > < /tr > < tr > < td width="150px" >> Cell 3 < /td > < /tr > </table> [/TD] [TD="class: header"] کد بدون خاصيت rowspan[/TD] [/TR] [TR] [TD="class: body"] [TABLE] [TR] [TD="width: 150px"] Cell 1[/TD] [TD] Cell2[/TD] [/TR] [TR] [TD] Cell3 [/TD] [/TR] [/TABLE] [/TD] [TD="class: header"] خروجی کد بدون خاصيت rowspan[/TD] [/TR] [TR] [TD="class: body, align: right"] می بينيم بدون استفاده از خاصيت rowspan در سطر با خانه کمتر ، عملا جدول به هم ريخته بوده و خروجی درستی ندارد . در قسمت زير با اضافه کردن خاصيت rowspan به خروجی درست می رسيم . [/TD] [TD="class: header"] توجه ![/TD] [/TR] [TR] [TD="class: body"] < table width="450px" border="1" > < tr > < td width="450px" rowspan="2" > Cell 1 < /td > < td width="150px" > Cell 2 < /td > < /tr > < tr > < td width="150px" >> Cell 3 < /td > < /tr > </table> [/TD] [TD="class: header"] کد با خاصيت rowspan [/TD] [/TR] [TR] [TD="class: body"] [TABLE] [TR] [TD="width: 450px"] Cell 1 [/TD] [TD="width: 150px"] Cell 2[/TD] [/TR] [TR] [TD="width: 150px"] Cell 3[/TD] [/TR] [/TABLE] [/TD] [TD="class: header"] خروجی کد با خاصيت rowspan [/TD] [/TR] [/TABLE]
