جلسه چهاردهم

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

خب اول بحث جدول رو با تتمه شناسه هایش خاتمه بدیم بعد بریم سراغ بیان تگ های جدید...
یک شناسه ای که در جدول ها فوق العاده جالب است شناسه background هست این شناسه که در تگ <td> بکار می رود باعث می شود که یک عکسی یا چیزی را ما پس زمینه یک خانه جدول قرار دهیم یک مثال تصویری میزنم که فکر کنم همه چیز برایتان جا بیفتد.

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

<"table align="center>
<tr>
 <width="801"  height="255 "محلی که عکس مورد نظر در آنجا قرار دارد"=td background>
<td/>
<tr>
<table/>

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

و اما تگ هایی که قولش را داده بودم ...

تگ <img>... این تگ برای گذاشتن عکس و تصویر درون سایت استفاده می شود حتما این نکته را می دانید که یکی از بهترین راههای تعامل و جذب بازدید کننده قرار دادن تصاویر مختلف در صفحه وب است.پس استفاده از تصویر در صفحات وب خیلی مهم است.اما کار به اینجا ختم نمی شود...شما باید شناسه src را حتما درون این تگ بکار ببرید چرا که توسط این شناسه آدرس عکس مورد نظر را می دهید...به مثال توجه کنید:

<"آدرس عکس مورد نظر"=img src>

تگ بعدی که برای گذاشتن صدا در وب است را هم بگم که زیاد معطل نمونید و سپس شروع می کنیم به بیان شناسه های تگ <img>

تگ <bgsound>...این تگ هم همانطور که از اسمش پیداست برای گذاشتن صدا روی صفحات وب است البته این تگ هم از شناسه src برای بیان آدرس موزیک بهره می برد...در ضمن نکته ای که باقی می ماند این است که فقط شما می توانید از موزیک های با پسوند wav و midi در این تگ بهره ببرید...به مثال توجه کنید:

<"آدرس موزیک با آن دو پسوندی که ذکر شد "=bgsound src>

به همین صورتی که مشاهده کردید باید استفاده کرد...نکته ای که شاید کمتر به آن توجه کرده باشید این است که این دو تگ که در آخر گفتیم یعنی تگ های <img> و <bgsound> نیاز به تگ پایان دهنده ندارند...

شناسه های تگهای <img> و <bgsound> بماند برای فردا ...جلسه امروز خیلی طولانی شد...ممنون ...علیرضا

پایان جلسه چهاردهم

جلسه سیزدهم

سلام...سریع میرم سراغ درس امروز ...در ادامه بحثمون که در مورد جدول بود به شناسه های colspanو rowspan میرسیم این شناسه ها در تگ <td> استفاده می شوند که کار آنها به این صورت است که برای ادغام خانه های جدول بکار می روند به عنوان مثال به این شکل توجه کنید:

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

<"table border=2 bordercolor="red" align="center>
<tr>
<td/>برای دسترسی به صفحات سایت روی شماره ها کلیک کنید<"td colspan=3 align="center>
<tr/>
<tr>
<td align="center">1</td><td align="center">2</td><td align="center">3</td>
<tr/>
<tr>
<td align="center">4</td><td align="center">5</td><td align="center">6</td>
<tr/>
<tr>
<td align="center">7</td><td align="center">8</td><td align="center">9</td>
<tr/>
<table/>

همانطور که می بینید من چهار سطر برای این جدول اختیار کردم که سطر اولم را یک خانه ای و سه سطر بعدی را سه خانه ای اختیار کردم...و در همان سطر اول از شناسه colspan به مقدار تعداد خانه های سطور بعد اختیار کردم...یعنی عدد ۳...و این باعث شد که سطر اول مشتمل بر سه خانه ادغام شده در هم باشد...متوجه شدید؟...تمرین کنید تا مسلط شوید...

یک نکته ای بگم...ببینید همانطور که می دانید تگ <td> برای ایجاد خانه های جدول بکار می رود ما به جای تگ <td> هم می توانیم از تگ <th> استفاده کنیم که آن هم برای ایجاد خانه های جدول بکار می رود تنها فرقی که این دو تگ با هم دارند در این است که تگ <th> متنی را که بین تگ آغازین و پایانی آن نوشته می شود را وسط چین می کند و همینطور آن را bold و ضخیم می کند ...مثلا در مثال بالا من در همه تگ های <td> برای اینکه متن داخلش وسط چین شود مجبور شدم در همه آنها از شناسه align استفاده کنم ...که اگر به جای این کار از تگ <th> استفاده کرده بودم کار بسیار ساده تر بود مگه نه؟....من به خاطر اینکه حجم درس ها یک کمی داره سنگین تر میشه یک کمی سرعتم رو کم کردم ..تا شما هم براحتی مطالب رو یاد بگیرید ...امیدوارم که اینطور باشه...ممنون...علیرضا

پایان جلسه سیزدهم

جلسه دوازدهم

به نام خدا ...سلام...امروز با ادامه بحث جدول در صفحات وب در خدمتتون هستیم....خب بریم سراغ اصل مطلب...

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

شناسه caption

بوسیله این شناسه می توانید در چهار جهت یک جدول متنی را قرار دهید...مثلا شاید توی کتابها یا در وب سایت ها دیده باشید که در زیر یا بالای جدول متنی را قرار می دهند مثلا می نویسند «جدول شمارهn» ...که این کار توسط شناسه caption امکان پذیر است و که مقادیری که به آن اختصاص می یابد از این قرار است:

متن را در بالای جدول قرار می دهد              "caption="top
متن را در زیر جدول قرار می دهد            "caption="bottom
متن را در سمت چپ جدول قرار می دهد       "caption="left
متن را در سمت راست جدول قرار می دهد   caption="right

که البته این شناسه در تگ <table> استفاده می شود.
یک نکته هم بگم و اون اینه که شما به طور معمول نمی توانید در یک جدول یک خانه خالی ایجاد کنید و برای این کار شما باید این کد را که خیلی هم مهم است و در خیلی جاها به آن برخورد می کنید در داخل تگ <td>(منظور بین تگ آغازین و پایانی تگ <td> است.)بکار ببرید..و آن کد این است..
«;nbsp&» مرورگر وقتی به این کد میرسد یک کارکتر فضای خالی یا فاصله ایجاد می کند...به بیان ساده تر این کد همان space خودمان است.
کاربرد آن به این صورت است.

<"table border=2 bordercolor="red>
<tr>
<td>&nbsp;</td>
<tr/>
<table/>

تعداد زیادی از شناسه های تگ <table> را گفتیم و هنوز تعداد زیادی از شناسه های این تگ باقی مانده است..این طور فایده ندارد که من همینطور بگم و شما هم بخونید و بروید ...باید روی این شناسه ها تمرین کنید تا کاملا مسلط شوید . البته اگر دوست دارید که یک طراح حرفه ای سایت شوید!
ان شاء الله باقی شناسه های این تگ را فردا خدمتتون عرض می کنم ..یادتون نره که باید زیاد تمرین کنید...ممنون علیرضا

پایان جلسه دوازدهم

جلسه یازدهم

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

خب جدول در وب تشکیل شده از تعدادی خانه و یک خط دور همه خانه ها ...شناسه ای که الان خدمتتون معرفی می کنم در اندازه خانه های جدول تغییر ایجاد می کند...و برای بزرگ یا کوچک کردن خانه های جدول بکار می رود.
شناسه cellpadding که این شناسه را باید در تگ <table> بکار ببرید...خب به طبع وقتی خانه های جدول توسط این شناسه بزرگ می شود خود جدول نیز بزرگ می شود...در ضمن من هر وقت حرف از بزرگ یا کوچکی می زنم منظورم این است که باید به این شناسه ها مقدار عددی بدهید ...در غیر این صورت حتما آن را ذکر می کنم....به مثال دقت کنید.

<table cellpadding=2>

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

می بینید؟...اندازه خانه های جدول ثابت است ولی خانه ها از خط دور فاصله گرفته اند.و به طبع جدول بزرگ هم شده است....
از دیگر شناسه های جدول که بسیار پر اهمیت است شناسه های width و height است قبل از هر چیز به این شکل توجه کنید....

این شکل که قالب یکی از بچه های وبلاگیست است چیزی نیست جز یک جدول که از یک خانه تشکیل شده و از شناسه های width و height استفاده شده بعلاوه چند شناسه دیگر که با هم بررسی می کنیم...اول تعریف این دو شناسه...
شناسه width باعث میشود جدول در عرض ضخامتش به میزان عددی که شما تعیین می کنید تغییر کند مثلا در این شکلی که مثال زدیم از شناسه width استفاده کرده و مقدار آن را برابر ۷۵۰ گذاشته است...
شناسه height نیز باعث می شود جدول در طول ضخامتش تغییرکند...که در اینجا طول را برابر ۹۴ قرار داده است(طراح قالب)...(جفت این شناسه ها همانطور که می دانید باید در تگ <table> استفاده شود)

یک شناسه دیگر هم می خواهم الان بگم که در آن شکل که مثال زدیم استفاده شده....
شناسه align که این شناسه هم در تگ <table> استفاده می شود و هم در تگ <td> که برای خانه ها و سلول های جدول است...به شکل بالا دقت کنید ....می بینید که عبارت «مورچه جون» دقیقا در وسط جدول یک خانه ای استفاده شده...این مطلب دقیقا کاربرد شناسه align را می رساند...پس شناسه align همانطور که قبلا بارها گفته شده برای راست چین وسط چین و چپ چین کردن متن یا جدول در مثال مذکور بکار می رود. به این صورت:

align="right
که اگر این شناسه داخل تگ <td> بکار رود باعث می شود که متن درون آن راست چین شود

align="center
که اگر این شناسه داخل تگ <td> بکار رود باعث می شود که متن درون آن وسط چین شود

align="left
و این شناسه هم باعث می شود متن درون تگ <td> چپ چین شود

در شکلی که ملاحظه کردید متن درون تگ <td> (یعنی بین تگ آغازین و پایانی <td>) را وسط چین کرده و عبارت «مورچه جون» دقیقا در وسط آن خانه واقع شده است ...طبق این توضیحاتی که دادم شما هم باید بتوانید این جدول را ترسیم کنید و حتما این کار را انجام دهید چرا که بحث جدول نیاز به تمرین و تکرار دارد و بدون آن هرگز یک طراح خوبی نمی شوید ....پس تمرین کنید و در جایی که اشکال داشتید مطرح کنید با هم اشکال زدایی می کنیم....ممنون...علیرضا

پایان جلسه یازدهم