آیا میدانید در طول 3500 سال تاريخ بشر
فقط 250 سال جنگ نداشته ايم
تن پوشي زيباتر از سرشت و گفتار نيکو سراغ ندارم. از اُرد بزرگ |
![]() |
کامپایلر قدرتمند Atmel AVR Studio 6 نسخه 6
دانلود شبیه ساز قدرتمند proteus 7.10 SP0 همراه با کرک و لایسنس و کتابخانه
آموزش گام به گام برنامه نویسی AVR به زبان C
کتابخانه شبیه ساز LCD های نوکیا برای پروتیوس
پروژه تولید سیگنال های ویدیوئی PAL با AVR به زبان اسمبلی
پروژه ارتباط AVR با RS232 و برنامه کنترلی با ویژوال بیسیک
اتصال کیبورد 4*4 به میکروکنترلر AVR و نمایش روی سون سگمنت|
آموزش ساختن جدول در طراحی صفحه با HTML
آیا شما می خواهید یک جدول (table) در صفحه خود ایجاد کنید؟ برای ایجاد یک جدول باید از این تگ استفاده کنید:
<table>
........محتویات جدول....... </table>
برای ایجاد یک جدول باید تگ ابتدایی آن یعنی <table> را در جایی که می خواهید جدول وارد شود، قرار دهید. و در پایان جدول هم از تگ پایانی آن یعنی <table/> استفاده کنید.
<table>
<td> ........محتویات جدول...... </td> </table> جدول به دست آمده مانند زیر به نظر می رسد:
البته این یک جدول ساده است و شاید در ظاهر زیاد تفاوتی با یک نوشته ساده نداشته باشد. می توانیم برای جدول کادر (border) هم تعریف کنیم. برای این کار باید شناسه مربوطه را در تگ جدول قرار دهیم. مانند زیر:
<table border="3">
<td> ........محتویات جدول...... </td> </table> حالا جدول ما کمی مشخص تر شد، به آن نگاه کنید:
شما می توانید ضخامت کادر جدول را به دلخواه خود تغییر دهید. برای این کار فقط کافی است تا عددی را که به عنوان مقدار شناسه border به کار بردیم، تغییر دهید. اگر مقدار این عدد را صفر قرار دهید کادر دیده نخواهد شد. تا اینجا هر چه گفتیم درباره جدولی با یک سلول بود. برای اینکه جدولی با تعداد بیشتری سلول داشته باشیم، مثلاً بخواهیم یک سلول دیگر در همان خط ایجاد کنیم، باید دوباره از تگ td استفاده کنیم. مانند زیر:
<table border="3">
<td> سلول اول </td> <td> سلول دوم </td> </table> می توانید سلولهای ایجاد شده را در اینجا مشاهده کنید:
حالا فرض کنید می خواهیم به خط بعدی یا به اصطلاح به ردیف بعدی برویم. برای این کار باید از تگ tr استفاده کنیم. این تگ با <tr> شروع و با <tr/> پایان می پذیرد. مانند زیر:
<table border="3">
<td> سطر اول و سلول اول </td> <td> سطر اول و سلول دوم </td> <tr> <td> سطر دوم و سلول اول </td> <td> سطر دوم و سلول دوم </td> </tr> </table>
نتیجه به این صورت مشاهده می شود:
شما می توانید بنا به نیاز خود فرمانهایی را به تگ جدول اضافه کنید. در اینجا برخی از این فرمانها آورده شده است:
فرض کنید می خواهیم در مثال قبل بین سلولها یک فاصله به اندازه 10 ایجاد کنیم. تگ جدول را مطابق زیر تغییر می دهیم:
<table border="3" cellspacing="10">
جدول به دست آمده به شکل زیر خواهد بود:
حالا فرض کنید می خواهیم یک فاصله به اندازه 10 را به داخل سلولهای جدول مثال قبل اضافه کنیم. تگ جدول را به این صورت تغییر می دهیم:
<table border="3" cellpadding="10">
جدول به دست آمده به صورت زیر خواهد بود:
حالا می خواهیم هر دو مثال قبل را با هم امتحان کنیم، یعنی تگ جدول را مطابق زیر تغییر دهیم:
<table border="3" cellspacing="10" cellpadding="10">
نتیجه را ملاحظه کنید:
شما می توانید هر چیزی را که بخواهید داخل سلولها وارد کنید. مانند عکس، لینک، پاراگراف و...
<table border="2">
<td> <a href="../javascript/index.html">آموزش جاوا اسکرپت</a> </td> </table> این هم جدولی که بیننده نهایی در صفحه مشاهده می کند:
برای وارد کردن عکس نیز می توانیم به این صورت عمل کنیم:
<table border="2">
<td> <img src="learn_html.gif"> </td> </table> این هم نتیجه کد:
برای ادامه معرفی خواص جدولها با ما به بخش بعدی بیایید. منبع: www.neopersia.org
لینک ثابت این صفحه: © کپی برداری از مطالب این سایت تنها با ذکر منبع مجاز می باشد
در صورت داشتن هر گونه سوال، نظر و پیشنهاد راجب این مطلب میتوانید در قسمت نظرات همین صفحه مطرح نمائید. همچنین با شرکت در نظر سنجی های سایت، ما را در بهبود بخشیدن به مطالب یاری کنید. آموزش طراحی صفحات وب آموزش طراحی وب آموزش html آموزش اچ تی ام ال جدول جدول در صفحات وب ساختن جدول در html سلول انتخاب پس زمینه برای جدول ابعاد جدول اندازه جدول table html مرتبط باموضوع : استفاده از فریمهای نامرئی در صفحه [ سه شنبه، 15 آذر ماه، 1390 ] 222 مشاهده
اصول طراحی صفحات حاوی فریم -- بخش اول [ پنجشنبه، 10 آذر ماه، 1390 ] 269 مشاهده
نوشتن متن ها به صورت ضخیم، مورب، زیر خط دار و خط خورده با HTML [ چهارشنبه، 25 آبان ماه، 1390 ] 181 مشاهده
ساختن لینک به نقاط مختلف یک صفحه HTML [ چهارشنبه، 2 آذر ماه، 1390 ] 261 مشاهده
شناسه های مختلف قابل استفاده برای خط افقی [ پنجشنبه، 10 آذر ماه، 1390 ] 114 مشاهده
| ||||||||||||||||||||||||
آیا این مطالب مورد رضایت شما واقع گردید؟ لطفا با رای دادن به این مطلب ما را در بهبود بخشیدن به مطالب کمک کنید. با اینکار به سایر دوستانتان نیز کمک خواهید کرد.
|
| ||||||||||||||||||||||||||||||||||||||||||
رویداد ها: روز بزرگداشت ملاصدرا - روز بهره وری و بهینه سازی مصرف |