آموزش گام به گام HTML : قسمت پنجم

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






جدول ها در HTML

جدول ها در HTML توسط برچسب <table> ايجاد می شوند. يک جدول توسط برچسب <tr> به سطرها تقسيم می شود و هر سطر توسط برچسب <td> به خانه های اطلاعاتی تقسيم می شود. يک خانه اطلاعاتی متواند شامل متن، تصوير، فهرست، پاراگراف، فرم، جدول و يا هر چيز ديگری باشد. دو مثال زير طريقه استفاده از برچسبهای گفته شده را نشان می دهد.
* مثال زيريک جدول حاشيه دارمی باشد که ضخامت حاشيه توسط مشخصه border=:"1” تعيين شده است.

آموزش گام به گام   HTML : قسمت پنجم

* در مثال زير يک جدول بدون حاشيه نشان داده شده است.

آموزش گام به گام   HTML : قسمت پنجم

مشخصه border

اگر شما مشخصه border را تعيين نکنيد جدول شما حاشيه نخواهد داشت. گاهی اوقات جدول بدون حاشيه برای طرحبندی صفحه مفيد است ولی اغلب اوقات می خواهيد که جدولتان حاشيه داشته باشد. برای نمايش جدولی با حاشيه بايد از مشخصه border استفاده کنيد؛ همانند جدول مثال قبل. عنوانها در جدول عناوين ستونها در يک جدول توسط بر چسب <th> مشخص می شوند. به مثال زير توجه کنيد.

آموزش گام به گام   HTML : قسمت پنجم

توسط برچسب <caption> می توانيد عنوانی برای جدول خود در نظر بگيريد. به مثال زير توجه کنيد.

آموزش گام به گام   HTML : قسمت پنجم

خانه های خالی در جدول

گاهی اوقات ما نياز پيدا می کنيم که بعضی از خانه های جدول خالی باشند. اگر جدول ما دارای حاشيه باشد و در خانه مورد نظر چيزی ننويسيم (<td></td>) در اين صورت جدول ما به صورت زير ديده می شود.
برای جلوگيری از بهم خوردن حاشيه بايد حرف نهادی &nbsp; را بکار ببريم يعنی از <td>&nbsp;</td> به جای <td></td> استفاده کنيم در اين صورت جدول به صورت زير خواهد بود.

مشخصه colspan

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

آموزش گام به گام   HTML : قسمت پنجم

مشخصه rowspan

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

آموزش گام به گام   HTML : قسمت پنجم

مشخصه cellpadding

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

آموزش گام به گام   HTML : قسمت پنجم

مشخصه cellspacing

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

آموزش گام به گام   HTML : قسمت پنجم

چند مشخصه ديگر در مورد جداول

*توسط مشخصه bgcolor می توانيد رنگ زمينه جدول يا خانه های آن را تعيين کنيد.

آموزش گام به گام   HTML : قسمت پنجم

*مشخصه width عرض جدول يا يک خانه را تعيين می کند و مشخصه height ارتفاع جدول يا يک خانه را تعيين می کند. و مقدار اين دو مشخصه معمولا بر حسب pixel می باشد.
*توسط مشخصه background می توانيد تصويری در پس زمينه جدول يا خانه ها قرار دهيد.

آموزش گام به گام   HTML : قسمت پنجم

*از مشخصه align برای مرتب کردن محتويات خانه های يک جدول در جهت افقی استفاده می شود که مثلا در سمت راست يا وسط ويا سمت چپ خانه قرار بگيرند ويا اينکه اگر محتويات خانه متن است، متن به صورت justify مرتب شود؛ و از مشخصه valign برای مرتب کردن محتويات خانه های يک جدول در جهت عمودی استفاده می شود.
<td align="left/center/right/justify">Make-Up</td>
<td valign="top/middle/bottom">Make-Up</td>
*مشخصه ديگری که در جدولها کاربرد دارد مشخصه frame است که دارای انواع border،box،void،above،below،hsides،vsides،lhs،rhs می باشد. سه مثال زير کاربرد اين مشخصه را نشان می دهد.

آموزش گام به گام   HTML : قسمت پنجم

آموزش گام به گام   HTML : قسمت پنجم

آموزش گام به گام   HTML : قسمت پنجم

نکته
يکی از نکات مهم در زيبايی صفحهHTMLشمااستفاده از طرح بندی (layout) مناسب است. يکی از معمولترين راهها در ايجادطرحبندی دلخواه استفاده از جداول می باشد. و برای اينکار معمولا از جداول بدون حاشيه استفادهمی کنند. به عنوان مثال متن اين نکته به شيوه روزنامه ای و توسط يک جدول بی حاشيه ودارای سه ستون ايجاد شده است.
ادامه دارد ......
* ارسال مقاله توسط عضو محترم سایت با نام کاربری : davidfattahi
/خ


تبلیغات در راسخون
نظرات کاربران
ارسال نظر
با تشکر، نظر شما پس از بررسی و تایید در سایت قرار خواهد گرفت.
متاسفانه در برقراری ارتباط خطایی رخ داده. لطفاً دوباره تلاش کنید.
موارد بیشتر برای شما
تحلیل ابعادی از روانشناسی زن در قرآن و روایات اهل بیت(ع)
تحلیل ابعادی از روانشناسی زن در قرآن و روایات اهل بیت(ع)
تحلیل راهبردی پیام ۱۳ آبان رهبر انقلاب: از «ایران هرچه قوی‌تر» تا «نظم جدید جهانی»
تحلیل راهبردی پیام ۱۳ آبان رهبر انقلاب: از «ایران هرچه قوی‌تر» تا «نظم جدید جهانی»
خاطراتی از حمید علیدوستی از جنگ عراق با ایران و از دست رفتن قهرمانی جام ملتهای آسیا ۱۹۸۰
play_arrow
خاطراتی از حمید علیدوستی از جنگ عراق با ایران و از دست رفتن قهرمانی جام ملتهای آسیا ۱۹۸۰
آقا حساب کردند...
play_arrow
آقا حساب کردند...
انقلاب دوم؛ «روایت تسخیر»
play_arrow
انقلاب دوم؛ «روایت تسخیر»
جزئیات جدیدی از پرونده جنایت میدان علیخانی اصفهان
play_arrow
جزئیات جدیدی از پرونده جنایت میدان علیخانی اصفهان
صیدگاه هرمز؛ ثبت لحظه انهدام پنجاه‌وپنجمین پهپاد پیشرفته MQ-۹
play_arrow
صیدگاه هرمز؛ ثبت لحظه انهدام پنجاه‌وپنجمین پهپاد پیشرفته MQ-۹
بازدید نماینده ولی‌فقیه در سپاه از تونل‌های موشکی جنوب
play_arrow
بازدید نماینده ولی‌فقیه در سپاه از تونل‌های موشکی جنوب
آخرین وضعیت پرونده پلتفرم زرپاد، فروش آنلاین طلا
play_arrow
آخرین وضعیت پرونده پلتفرم زرپاد، فروش آنلاین طلا
علت توقف اجرای حکم اعدام متهم خانه وحشت چه بود؟
play_arrow
علت توقف اجرای حکم اعدام متهم خانه وحشت چه بود؟
حمله وحشیانه پلیس آلمان به دختر معترض
play_arrow
حمله وحشیانه پلیس آلمان به دختر معترض
تصاویری از حمله رژیم صهیونیستی به جنوب لبنان
play_arrow
تصاویری از حمله رژیم صهیونیستی به جنوب لبنان
اینترنشنال توجیه‌گر حمله به زیرساخت‌های ایران
play_arrow
اینترنشنال توجیه‌گر حمله به زیرساخت‌های ایران
لحظه رهگیری و انهدام پهپاد MQ۹ آمریکایی در شرق تنگه هرمز
play_arrow
لحظه رهگیری و انهدام پهپاد MQ۹ آمریکایی در شرق تنگه هرمز
دردسرهای انتخاباتی ترامپ
play_arrow
دردسرهای انتخاباتی ترامپ