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یا «محیط توسعه یکپارچه» نرمافزاریطراحی سایت است که برای کمک به برنامهنویسان …
بارگذاری بیشتر در طراحی وب

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد.

بررسی کنید

طراحی وب

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