افتخار طراحی سایت بیش از ۱۷۰۰ کسب و کار ایرانی و خارجی
نمونه کارها
آموزش طراحی سایت(جلسه 12):Table جدول
نظاره گر پیشرفت کسب و کار خود باشید ، وقتی اسپیناس وب جرئی از تیم شما می شود
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=”1 |
| طول و ارتفاع جدول را مشخص ميکند | ”width=”500px” height=”400px |
| رنگ پس زمينه را مشخص ميکند | ”bgcolor=”green |
20 table row
21 tableطراحی سایت division
td
tr
27
| رنگ خط دور جدول را مشخص ميکند | ”bordercolor=”red |
| فاصله متن را از خط دور سلولها تعيين ميکند | ”cellspacing=”10px |
| فاصله سلولهای جدول از يکديگر را تعيين ميکند | ”cellpadding=”5px |
| چينش جدول در صفحه را مشخص ميکند | ”align=”center right left |
نکاتی درباره قالب اصلی سایت:
طول سايت نبايد طولاني شود؛ يعني نبايد scrollافقي داشته باشد. طراحی سایتطبق آمار، رزولوشن برای اکثر کاربران
بيشتر از 1024در 768است. پس ساختار کلي سايت بايد چيزی شبيه اين باشد:
تگ :td
– در تگ tdنميتوان heightداد. بايد از widthاستفاده کنيد.
– بهتر است بين tdهای خالي ; تايپ شود.
950px
| 150px | |
| 150px Menu |
محتوای صفحه |
| Footer |
100px
Header
21
برای ادغام ستوني، از صفت colspanاستفاده ميشود.طراحی سایت مثلاً برای ادغام دو سلول از کد “colspan=”2
استفاده کنيد و به تعداد -1 ،colspanعدد از tdها را حذف کنيد. يعني برای همين مثال، يک > <tdبايد
حذف کنيد و برای ادغام 3ستون دو عدد از tdها را پاک ميشود.
مثال)
| <table border=“1” width=“200” height=“200”> <tr> <td colspan=“2”> </td> </tr> <tr> <td> </td> <td> </td> </tr> </table> |
نکته: در ادغام سطری به طراحی سایتجای colspanاز rowspanاستفاده کنی
درگ کنید
مشاهده
بستن
پخش
0%