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استفاده کنی

بارگذاری نوشته های مرتبط بیشتر
بارگذاری بیشتر در طراحی وب