Table جدول

جدول یکی از سنگینترین عناصر وبطراحی سایت است و سرعت لود شدن سایت را پایین میآورد. بنابراین تا میتوانیدکمتر استفاده کنید.طراحی سایت برای ترسیم جدول به دو تگ < >tr20و < >td21نیاز داریم که trها بیانگر تعداد سطرو tdها بیانگر تعداد ستونهای جدول هستند. ابتدای جدول با > <tableو انتهای آن با > </tableمشخصمیشود.

برای رسم جدولی به شکل زیر، از این کدها استفاده میشود:

Cell1 Cell2 Cell3
Cell4 Cell5 Cell6

 

<table>
<
tr>
<
td>Cell1</td>
<
td>Cell2</td>
<
td>Cell3</td>
</
tr>
<
tr>
<
td>Cell4</td>
<
td>Cell5</td>
<
td>Cell6</td>
</
tr>
</
table>

صفات تگ :table

چینش ارتفاعی نوشته را در سلولها مشخص میکند valign=middle top
bottom
ضخامت خطهای جدول را مشخص میکند border=”۱
طول و ارتفاع جدول را مشخص میکند width=”۵۰۰px” height=”۴۰۰px
رنگ پس زمینه را مشخص میکند bgcolor=”green

۲۰ table row
۲۱ tableطراحی سایت division
td
tr

۲۷

رنگ خط دور جدول را مشخص میکند bordercolor=”red
فاصله متن را از خط دور سلولها تعیین میکند cellspacing=”۱۰px
فاصله سلولهای جدول از یکدیگر را تعیین میکند cellpadding=”۵px
چینش جدول در صفحه را مشخص میکند align=”center
right
left

نکاتی درباره قالب اصلی سایت:
طول سایت نباید طولانی شود؛ یعنی نباید scrollافقی داشته باشد. طراحی سایتطبق آمار، رزولوشن برای اکثر کاربران
بیشتر از ۱۰۲۴در ۷۶۸است. پس ساختار کلی سایت باید چیزی شبیه این باشد:
تگ :td
– در تگ tdنمیتوان heightداد. باید از widthاستفاده کنید.
– بهتر است بین
tdهای خالی ;  تایپ شود.
۹۵۰px

۱۵۰px
۱۵۰px
Menu
محتوای صفحه

 

Footer

۱۰۰px
Header

۲۱
برای ادغام ستونی، از صفت colspanاستفاده میشود.طراحی سایت مثلاً برای ادغام دو سلول از کد “colspan=”2
استفاده کنید و به تعداد ،colspanعدد از tdها را حذف کنید. یعنی برای همین مثال، یک > <tdباید
حذف کنید و برای ادغام ۳ستون دو عدد از
tdها را پاک میشود.
مثال)

<table border=“1” width=“200” height=“200”>
<
tr>
<
td colspan=“2”>
</
td>
</
tr>
<
tr>
<
td>
</
td>
<
td>
</
td>
</
tr>
</
table>

نکته: در ادغام سطری به طراحی سایتجای colspanاز rowspanاستفاده کنی

  • نکات مهم قبل از استارت طراحی سایت

    نکات مهم قبل از استارت طراحی سایت امروز در طراحی سایت اسپیناس وب می خواهیم در مورد نکاتی م…
  • بهبود رتبه گوگل

    اگر شما هم جزء افرادی که به دنبال رسیدن سایت خودتان به نفرات اول گوگل هستید و یا قبلا رتبه…
  • اهمیت طراحی سایت در شبکه های اجتماعی

    اهمیت طراحی سایت در شبکه های اجتماعی امروز می خواهیم در مورد شبکه های اجتماعی و طراحی سایت…
  • راهنمای قدم به قدم بالا بردن رنک سایت در گوگل

    راهنمای قدم به قدم بالا بردن رنک سایت در گوگل امروز در طراحی سایت اسپیناس در خصوص راه و رو…
  • افزایش رتبه سایت در الکسا

    در دنیای امروز که صنعت و تکنولوژی به سمت اینترنت در حال حرکت است همه اشخاص و شرکت ها که در…
  • افزایش رتبه سایت در گوگل

    افزایش رتبه سایت در گوگل مسابقه صدر جدولی گوگل !!! یکی از مهم ترین دغدغه های مدیران وب سای…
بارگذاری نوشته های مرتبط بیشتر
  • طراحی وب

    طراحی وب اگر می خواهید بهترین نتیجه را در طراحی وب داشته باشید! تمام تمرکز خود را به رابط …
  • آموزش طراحی سایت(جلسه ۱۸):CSS چیست؟

    CSS چیست؟ CSS به معنایطراحی سایت «صفحات استایلی آبشاری» است و روشی است برای قالب بندی و طر…
  • آموزش طراحی سایت(جلسه ۱۷):دکمه ها

    دکمهها: – دکمه :submitاین عنصر برای تأیید طراحی سایتفرم استفاده میشود. زمانی که بر ر…
  • آموزش طراحی سایت(جلسه ۱۶):textarea فیلد

    textarea فیلد – در این فیلد شما میتوانید به میزان نامحدود کاراکتر وارد کنید. طراحی س…
  • آموزش طراحی سایت(جلسه ۱۵):تگ form

    تگ form از تگ inputبرای قرار دادن انواع کنترلهای طراحی سایتدریافت اطلاعات از کاربر در فرمه…
  • آموزش طراحی سایت(جلسه ۱۴):هاIDE

    هاIDE یک ۲۲IDEیا «محیط توسعه یکپارچه» نرمافزاریطراحی سایت است که برای کمک به برنامهنویسان …
بارگذاری بیشتر در طراحی وب

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

پنج × چهار =

بررسی کنید

طراحی وب

طراحی وب اگر می خواهید بهترین نتیجه را در طراحی وب داشته باشید! تمام تمرکز خود را به رابط …