111111111111.jpg "ارسال پیام به hossein201273")
پاسخ به:جدول های HTML
سه شنبه 29 بهمن 1392 12:00 AM
جدولها
این مثال به ما نشان می دهد که چگونه می توانیم یک جدول بکشیم.
حاشیه جدول
این مثال حاشیه های مختلف جدول را نشان می دهد.
(مثالهای بیشتر، در انتهای این صفحه آمده است)
جداول بوسیله برچسب<table>معرفی می شوند.هر جدول به سطرها (بوسیله برچسب <tr>)و هر سطر به سلول های داده تقسیم می شود (بوسیله برچسب <td>) حروف td بیانگر داده جدولی (table data) هستند که حاوی سلول داده است.یک سلول داده می تواند حاوی متن ، عکس ، لیست ها ، پاراگراف ها ، فرم ها ، خط های افقی و جدول ها و... باشد.
|
<table border="1"> <tr> <td>row1,cel1</td> <td>row1,cel2</td> </tr> <tr> <td>row1,cel1</td> <td>row1,cel1</td> </tr> </table> |
اگر شما عنصر حاشیه را معین نکنید ، جدول بدون حاشیه نشان داده خواهد شد. گاهی اوقات این می تواند مفید باشد اما بیشتر مواقع شما می خواهید که حاشیه ها نشان داده شوند.برای نشان دادن جداول با حاشیه شما باید از عنصر حاشیه (border) استفاده کنید.
<table border="1">
<tr>
<td>row1,cel1</td>
<td>row1,cel2</td>
</tr>
<tr>
<td>row2,cel1</td>
<td>row2,cel2</td>
</tr>
</table>
سرتیترها در یک جدول با برچسب <th>مشخص می شوند.
|
|
<table border="1"> <tr> <th>Heading</th> <th>Another Heading</th> </tr> <tr> <td>row1,cel1</td> <td>row1,cel2</td> </tr> </table> |
سلول های جداول با محتوای خالی در بیشتر مرورگرها خوب نشان داده نمی شوند.
|
<table border="1"> <tr> <td>row1,cell1</th> <td>row1,cell2</th> </tr> <tr> <td>row2,cel1</td> <td></td> </tr> </table> |
این کدها در مرورگر بدین صورت نشان داده می شوند.توجه کنید که حاشیه های اطراف سلول خالی جدول از بین رفته است(موزیلا فایر فاکس(Fire Fox) حاشیه را نشان می دهد.).برای جلوگیری از آن یک فاصله نا مقطوع(;nbsp&) به سلول داده خالی اضافه کنید تا حاشیه را مشخص سازید.
|
<table border="1"> <tr> <td>row1,cell1</th> <td>row1,cell2</th> </tr> <tr> <td>row2,cel1</td> <td> </td> </tr> </table> |
عناصر <thead>، <tbody>و <tfoot>به دلیل پشتیبانی بد مرورگر ها به ندرت مورد استفاده قرار می گیرند. انتظار می رود که در نسخه های بعدی XHTML این روند تغییر کند.
جدول بدون حاشیه
در این مثال یک جدول بدون حاشیه را می بینید.
سرتیترهای جدول
چگونگی نمایش سرتیترها را در جدول می بینید.
سلول خالی
این مثال طریق استفاده از " "، برای نمایش صحیح سلولهای خالی را نشان می دهد.
عنوان جدول
این مثال چگونگی عنوان دار کردن جدول را نشان می دهد.
توسعه سلول جدول به بیش از یک سطر یا ستون
در این مثال چگونگی ساخت سلولی که بیش از یک ستون یا سطر را می پوشاند را می بینید.
جدول در جدول
برای ساخت جدولی، درون یک جدول دیگر، به این مثال توجه کنید.
حاشیه خالی سلول
در این مثال، روش قرار دادن حاشیه خالی بین محتوای سلول و حاشیه ان را می آموزیم.
فاصله سلولها
برای تعیین فاصله بین سلولها به این مثال توجه کنید.
زمینه جدول
برای زمینه جدول می توان یک رنگ و یا یک عکس را انتخاب کرد. به این مثال توجه کنید.
زمینه برای یک سلول
همانند مثال قبل است با این تفاوت که این بار زمینه فقط برای یک سلول انتخاب می شود.
محل نمایش محتوای یک سلول
با استفاده از موجودیت "align"، می توان محل نمایش محتوای یک سلول را تعیین کرد. برای این منظور به این مثال توجه کنید.
تعین قاب دور جدول
به کمک موجودیت "frame"، میتوان نوع قاب دور جدول را تعیین کرد. نگاه کنید.
| برچسب ها | توضیحات |
|---|---|
| <table> | یک جدول معرفی می کند |
| <th> | سرتیتر جدول معرفی می کند |
| <tr> | یک سطر جدول معرفی می کند |
| <td> | یک سلول جدول معرفی می کند |
| <caption> | عنوان جدول معرفی می کند |
| <colgroup> | یک گروه از ستون ها معرفی می کند |
| <col> | یک مقدار موجودیت برای یک یا چند ستون معرفی می کند |
| <thead> | سر یک جدول را معرفی می کند |
| <tbody> | بدنه یک جدول را معرفی می کند |
| <tfoot> | پاورقی جدول را معرفی می کند |
مهربان همیشگی من... خودت گفتی:ادعونی استجب لکم... بخوانید مرا تا اجابت کنم شمارا...
گوش کن... این منم که اینروزها بیش از همیشه میخوانمت... اجابت کن مرا...
