.
وظایف
جداول یکی از مهمترین و در عین حال پیچیده ترین عناصری هستند که باید در صفحات وب وجود داشته باشند. با کمک آنها ، راحت است که اطلاعات مهم و مفید را به صورت مختصر ارائه دهید. البته اکثر ویرایشگران قالب هایی که روی موتورهای مختلف کار می کنند به شما امکان می دهند جدول را به صورت خودکار در صفحه ای از یک سایت یا نشریه ای جداگانه وارد کنید ، اما اگر طراحی یک منبع وب ، صفحات آن از ابتدا ایجاد شود ، چطور؟ سپس یک جادوگر مبتدی ممکن است با مشکلی روبرو شود: نحوه انجام این کار. بیایید بفهمیم چگونه این عنصر را به درستی و به سرعت ایجاد کنیم.
انتخاب ویراستار
اول از همه ، برای ایجاد یک جدول ، باید در مورد ویرایشگری که در آن کار خواهید کرد تصمیم بگیرید. البته ساده ترین راه این است که برنامه ای را انتخاب کنید که در آن کد اصلی سایت را ایجاد می کنید. اما بهتر است از یک دفترچه خوب قدیمی برای این اهداف استفاده کنید.
ممکن است بپرسید چرا زندگی خود را پیچیده می کنید ، زیرا اگر همه کارها را به طور همزمان در ویرایشگر انجام دهید ، نتیجه نیز بلافاصله قابل مشاهده است و همچنین می توانید از نکات برنامه استفاده کنید.
بله ، این درست است ، اما با ایجاد یک جدول از ابتدا ، شما نه تنها قادر خواهید بود اصل ایجاد آن را به طور کامل مطالعه کنید ، بلکه از اشتباهات غلط املایی و اشتباهات در کد اصلی نیز جلوگیری می کنید. گاهی اوقات اتفاق می افتد که مکان نما به طور تصادفی به سمت پایین حرکت می کند و در حین نوشتن یک خطا وارد کد می شود ، که گاهی اوقات پیدا کردن آن دشوار است. پس از ایجاد یک جدول در یک دفترچه یادداشت ، می توانید رمز آن را کپی کرده و در جایی که می خواهید بچسبانید.
الگوریتم ایجاد جدول
ابتدا بیایید یک الگوریتم کوتاه در مورد نحوه ایجاد جدول در HTML جمع آوری کنیم. این به این دلیل است که شما ترتیب هر مرحله را درک می کنید. سپس نحوه انجام هر یک از نکات را دقیقاً تجزیه و تحلیل خواهیم کرد.
بیایید با مراحل مقدماتی شروع کنیم.
1. یک تصویر شماتیک از جدول را روی یک ورق کاغذ بکشید.
2. ما تعداد خطوط و سلول ها را می شماریم. اگر تعداد دومی متفاوت باشد ، برای هر سطر جداگانه حساب می کنیم.
3. تعداد سلولهای سرصفحه در ردیف را تعیین کنید (به عنوان مثال ، سلولهای "شماره" ، "نام" و غیره).
4. پارامترهای اصلی جدول - رنگ ، ارتفاع و عرض ، تراز متن - را به طور کلی ، هر آنچه که فکر می کنید ضروری است ، بنویسید.
1. درج برچسب های جدول.
2. برچسب های خط را بر اساس شماره مورد نیاز خود وارد کنید.
3. در خطوط ، برچسب های سلول ها (معمولی و بزرگ) را وارد کنید ، همچنین بر اساس شماره ای که روی کاغذ نوشته اید.
4. پارامترهای جدول را به طور کلی تنظیم کنید.
5. در صورت لزوم ، شاخص ها را برای تک تک سلول ها تنظیم کنید.
6. سلول های خود را با متن پر می کنیم.
یک جدول ایجاد کنید
بنابراین شما یک ویرایشگر را انتخاب کرده اید ، حالا بیایید نحوه ایجاد جدول در HTML را بیاموزیم. برچسبی که جدول با آن در کد صفحه درج شده است (
) ، جفت می شود ، یعنی ساخت ما با این برچسب شروع می شود و با آن خاتمه می یابد
.با قرار دادن برچسب های جدول ، به ایجاد سطرها و سلول ها ادامه می دهیم.
بلافاصله ، توجه می کنیم که این عناصر نیز جفت شده اند. برچسب زدن
رشته ها را مشخص می کند ، و | - سلول ها. برای سلولهای سرصفحه ، از عنصر جفت شده استفاده کنید | . همانطور که قبلاً ذکر شد ، اولین قدم این است که خطوط را ترسیم کنید ، سپس سلولهای موجود در آنها را بنویسید. برای اینکه دچار سردرگمی نشوید ، به شما توصیه می کنیم که بین هر بلوک در یک یا دو خط فاصله ایجاد کنید یا یک بلوک جدید از عناصر را با استفاده از کلید "Tab" بنویسید. چگونه ممکن است به نظر برسد؟ مثل آن: ;;| شماره P / p | ;| نام خانوادگی | ; ;;| 1 | ;| ایوانف | ; | ; .
همانطور که می بینید ، هیچ چیز پیچیده ای در آن وجود ندارد. نکته اصلی این است که در تعداد خطوط و سلول ها اشتباه نگیرید. در غیر این صورت ، ممکن است جدول کج شود. ما در مورد ایجاد یک جدول در HTML بحث کرده ایم ، اکنون می توانیم به پارامترهای خود ماتریس و سطرها و سلول های آن برویم. 
پارامترهای جدولهنگام نوشتن کد ، باید به نکات زیر توجه کنید: تراز در حاشیه ، پس زمینه ، متن و غیره. پارامترهای جدول در برچسب تنظیم شده است ... این شامل:1. مرز - عرض مرزها. به عنوان یک عدد صحیح تنظیم کنید. به طور پیش فرض ، مرزهای هر جدول صفر است. 2. Bordercolor - رنگ حاشیه. می توان آن را به عنوان کد رنگ هگزا دسیمال (# 00008B) ، و نام آن به انگلیسی (DarkBlue) تنظیم کرد. به طور پیش فرض همیشه خاکستری است. 3. Bgcolor - همچنین با کد یا نام تنظیم می شود. 4. تراز - تراز متن پشت میز. پیش فرض تراز چپ است. گزینه های زیر برای این پارامتر وجود دارد: - چپ - به راست بپیچید ؛
- راست -بسته شدن به چپ ؛
- center - میز را در مرکز بدون پیچیدن نمایش می دهد.
5. عرض و ارتفاع - عرض و ارتفاع میز. می توان آن را به صورت پیکسل و به صورت درصد (نسبت به اندازه پنجره مرورگر) تنظیم کرد. با تجویز این یا آن شاخص ، باید به طراحی توجه ویژه ای داشته باشید. پارامتر باید با علامت "برابر" و مقدار مشخص شده در علامت نقل قول دنبال شود. در مورد رنگ متن ، آن را به همان شیوه متن معمولی در قالب HTML تنظیم می کند. نمونه ای از طراحی میز: ;;| شماره P / p | ;| نام خانوادگی | ; ;;| 1 | ;| ایوانف | ; | ; .
پارامترهای رشتهبنابراین ، ما قبلاً فهمیده ایم که چگونه یک جدول در HTML ایجاد کنیم و پارامترهای اصلی آن را ثبت کنیم. اما اگر ما نیاز به برجسته کردن یک ردیف داشته باشیم چه؟ آیا باید متفاوت از متن اصلی جدول طراحی شود؟ پارامترهای رشته در برچسب نوشته شده است دقیقاً مشابه داده های جدول متغیرهای زیر را می توان برای یک رشته تنظیم کرد:1. حاشیه ، بوردرنگ و bgcolor که قبلاً برای شما شناخته شده است. 2. تراز کردن - تراز کردن متن در یک خط. می تواند مقادیر چپ ، مرکز و راست را بگیرد. 3. Valign - این تگ متن را به صورت عمودی تراز می کند. مقادیر زیر را می گیرد: - بالا - متن با مرز بالا تراز شده است ؛
- وسط - در مرکز ؛
- پایین - در امتداد مرز پایین.
نمونه قالب بندی خط: ;| شماره P / p | ;| نام خانوادگی | ; .
پارامترهای سلولو آخرین چیزی که باید برای کسانی که می خواهند نحوه ایجاد جدول در HTML را بدانند توجه شود ، پارامترهای تک تک سلول ها ، منظم و بزرگ است. در واقع ، همه چیز به همان شیوه ای که برای یک جدول یا ردیف انجام می شود ، انجام می شود. تنها نکته این است که دو عنصر مهم دیگر اضافه می شوند: 1. Colspan - این پارامتر تعداد ستونهایی را که سلول می تواند عرض کند مشخص می کند. 2. Rowspan - از قبل تعداد سطرهایی را که این سلول اشغال می کند نشان می دهد. از آنجا که طرح با نوشتن یک خط متفاوت نیست ، ما نمونه ای از کد را ارائه نمی دهیم. 
نتیجه گیریساخت میز به همان اندازه که در نگاه اول به نظر می رسد دشوار نیست. نکته اصلی هنگام نوشتن کد او پشتکار و توجه است. در مورد نحوه قرار دادن یک جدول در HTML ، فقط باید رمز آن را در محل دقیق صفحه خود کپی و جایگذاری کنید ، به نظر شما ، به نظر شما ، باید در آن قرار داشته باشد. با خیال راحت آزمایش کنید و به زودی بر تکنیک ایجاد جداول به کمال مسلط می شوید. موفق باشید!
جداول HTML آنقدر کاربردی هستند که می توانید از آنها برای تایپ کردن کل سایت ها استفاده کنید (بخوانید). اکنون ما در مورد قرار دادن جداول HTML ساده در یک صفحه وب ، تجزیه فقط نشانه گذاری ، اما لمس نکردن به طراحی صحبت خواهیم کرد ، زیرا بهتر است جداول را با سبک های CSS تزئین کنید.
برچسب ها و ویژگی های جدول
در اینجا عناصر اساسی مورد نیاز برای ایجاد جداول وجود دارد:
- ظرفی که میز داخل آن قرار دارد (همان برای برچسب گذاری شده یا
برای لیست های شماره گذاری شده)
- مرز- صفتی که ضخامت فریم ها را تعیین می کند. بهتر است به جای آن از ویژگی CSS border استفاده کنید.
-
امضای جدول را مشخص می کند. نیازی به استفاده از ظرف ندارید ، اما اگر هنوز تصمیم دارید عنوان جدول را عنوان کنید ، آن را درست بعد از برچسب قرار دهید
، خارج از سلولها و خطوط.
- یک برچسب زوج حاوی یک سطر جدول (سلول هایی که در یک سطح به صورت افقی قرار دارند).
|
- برچسبی که سلول سربرگ جدول را ایجاد می کند. در ظاهر ، محتوای آن با محتوای سایر سلول ها - معمولاً متن داخل متفاوت است |
مرورگر پررنگ و مرکز است.
- ظرفی که با آن یک سلول ساده ایجاد می شود. رشته دارای چند تگ از این قبیل خواهد بود (برچسب
، تعداد زیادی سلول در آن وجود خواهد داشت: یک برچسب - یک سلول.
-
به شما این امکان را می دهد که ستون ها را به سرعت و بدون بهم ریختن کد گروه بندی کنید تا ویژگی های مشترک آنها تعریف شود. با استفاده از یک ظرف ، می توانید قسمت های منطقی یک جدول را از یکدیگر جدا کنید. بعد از برچسب قرار دارد
، اگر نه ، پس از آن
.
-
به همان منظور استفاده می شود
.
ممکن است حاوی باشد
اما نه برعکس
- طول- صفتی که تعداد ستون هایی را مشخص می کند که ویژگی های ظرف به آنها اعمال می شود
.
-
,
و
- ظروفی که به شما امکان می دهد جدول را به ترتیب به قسمتهای بالا (سرصفحه) ، اصلی (بدنه) و قسمت پایینی (نهایی) تقسیم کنید. در یک جدول HTML ، ترتیب این برچسب ها همان دنباله ظروف است
,
و در سند HTML
- کلسپنبرای ترکیب سلول ها در یک ردیف مورد نیاز است. مقدار ویژگی شامل یک عدد است که تعداد سلولهای ادغام شده را مشخص می کند.
- طول ردیفسلولها را در ستونها ادغام می کند.
نمونه ای از ایجاد جدول
یک سند HTML ایجاد کنید و کد زیر را در آن کپی کنید:
جدول نمونه
ابزارهای ساخت وب سایت
| وقت ملاقات | ابزار |
| نشانه گذاری | Html | XHTML |
| ثبت | CSS |
| توسعه از | پی اچ پی | پایتون |
در مرورگر ، سند به این شکل است: بیایید تجزیه و تحلیل کنیم که کدام خطوط کد مسئول چه چیزی هستند.
- با تنظیم ضخامت فریمها میز را باز کرد.
-
ابزارهای ساخت وب سایت
- عنوان کرد
- یک خط باز کرد
|
وقت ملاقات |
- یک سلول با طراحی عنوان ایجاد کرد.|
ابزار |
- یک سلول هدر دوم در ردیف ایجاد کرد. پارامتر colspan نشان داد که این سلول باید دو افقی را اشغال کند.
- خط را بست بقیه خطوط نیز به همین ترتیب ایجاد شده اند. |
نشانه گذاری |
Html |
XHTML |
- ردیف دوم جدول را با سلولهای معمولی و بدون سربرگ اضافه کرد. ردیف ها و سلول های بعدی نیز به طور مشابه وارد شدند.
- میز را بست.
بدنه میز است بدنه از ردیف ها و ستون ها تشکیل شده است. جدول خط به خط پر شده است.
هر برچسب یک خط جدید ایجاد می کند بیشتر در تو در تو ستون ایجاد می شود. چندین ستون را می توان ایجاد کرد. در این حالت ، باید تعداد ستون های هر ردیف را پیگیری کنید. به عنوان مثال ، اگر سطر اول 5 ستون داشت ، سطرهای بعدی نیز باید 5 ستون داشته باشند. در غیر این صورت ، میز شناور می شود. امکان ترکیب سلول ها وجود دارد.
نحوه ساخت جدول در html
بیایید یک مثال ، کد html ارائه دهیم:
به سلول توجه کنید | ... ما از ویژگی colspan ویژه برای ترکیب سلول ها به صورت افقی استفاده می کنیم. مقدار عددی آن نشان دهنده تعداد ستون هایی است که باید ترکیب شوند. همچنین یک آنالوگ از این ویژگی وجود دارد: tag | (سربرگ جدول) ، جایی که شما همچنین باید colspan بنویسید. نتیجه یکسان خواهد بود. اما td معمولی اغلب استفاده می شود.
اکنون اجازه دهید نگاهی دقیق تر به همه ویژگی های برچسب بیندازیم.
.
برچسب ویژگی ها و ویژگی ها
به تگ باز شما می توانید ویژگی های مختلف را بنویسید
1. Property align = "parameter" - تراز جدول را تنظیم می کند. می تواند مقادیر زیر را دریافت کند:
در مثال بالا ، جدول را در مرکز align = "center" تراز کردیم.
این ویژگی را می توان نه تنها در یک جدول ، بلکه در سلول های جداول جداگانه نیز اعمال کرد. یا رشته ها | ... بنابراین ، تراز در سلول های مختلف متفاوت خواهد بود.
مثلا
| ... |
| ... |
...
2. ویژگی پس زمینه = "URL" - تصویر پس زمینه را تنظیم می کند. به جای URL ، آدرس تصویر پس زمینه باید نوشته شود.
مثال
در صفحه به موارد زیر تبدیل شده است:
در مثال بالا ، تصویر پس زمینه ما در پوشه img (که در همان فهرست صفحه html قرار دارد) قرار دارد و تصویر fon.gif نامیده می شود. توجه داشته باشید که در برچسب ما style = "color: white؛" را اضافه کرده ایم. ... از آنجا که پس زمینه تقریبا سیاه است ، به طوری که متن با پس زمینه ادغام نمی شود ، ما متن را سفید کردیم.
3. ویژگی bgcolor = "color" - رنگ پس زمینه جدول را تنظیم می کند. به عنوان یک رنگ ، می توانید هر یک از کل پالت را انتخاب کنید (به کدها و نام رنگهای html مراجعه کنید)
4. Property border = "number" - ضخامت حاشیه جدول را تنظیم می کند. در مثال های قبلی ، ما border = "1" را مشخص کردیم ، به این معنی که عرض حاشیه 1 پیکسل است.
5. ویژگی bordercolor = "رنگ" - رنگ حاشیه را تنظیم می کند. اگر حاشیه = "0" باشد ، هیچ حاشیه ای وجود نخواهد داشت و رنگ حاشیه منطقی نخواهد بود.
6. ویژگی cellpadding = "number" - تورفتگی از قاب به محتوای سلول بر حسب پیکسل.
7. Properties cellpacing = "number" - فاصله بین سلول ها در پیکسل.
8. ویژگی ستون = "تعداد" - تعداد ستون ها. اگر آن را مشخص نکنید ، مرورگر به تنهایی تعداد ستون ها را تعیین می کند. تنها تفاوت این است که تعیین این پارامتر احتمالاً بارگذاری جدول را سرعت می بخشد.
9. قاب ویژگی = "پارامتر" - نحوه نمایش حاشیه ها در اطراف جدول. می تواند مقادیر زیر را دریافت کند:
- void - مرزها را ترسیم نکنید
- مرز - مرز دور میز
- بالا - حاشیه در بالای جدول
- زیر - حاشیه در انتهای جدول
- hsides - فقط حاشیه های افقی (بالا و پایین جدول) اضافه کنید
- vsides - فقط حاشیه های عمودی بکشید (چپ و راست جدول)
- rhs - فقط در سمت راست میز قرار دارد
- lhs - فقط در سمت چپ میز حاشیه دارد
10. ارتفاع ویژگی = "تعداد" - ارتفاع جدول را تنظیم می کند: یا بر حسب پیکسل یا بر حسب درصد.
11. قوانین ویژگی = "پارامتر" - جایی که مرزهای بین سلول ها نمایش داده می شود. می تواند مقادیر زیر را دریافت کند:
- همه - یک خط در اطراف هر سلول جدول کشیده شده است
- گروه ها - خط بین گروه هایی که توسط برچسب ها تشکیل شده اند نمایش داده می شود , , ,
یا
- cols - خط بین ستون ها نمایش داده می شود
- هیچ - همه مرزها پنهان هستند
- سطرها - مرز بین سطرهای جدول ایجاد شده از طریق برچسب کشیده می شود
12. عرض ویژگی = "تعداد" - عرض جدول را تعیین می کند: چه بر حسب پیکسل و چه در درصد.
13. کلاس class = "class_name" - می توانید نام کلاسی که جدول به آن تعلق دارد را مشخص کنید.
14. style style = "styles" - سبک ها را می توان به صورت جداگانه برای هر جدول تنظیم کرد.
اکنون زمان آن است که وارد جدول شوید و به ویژگی های سلول های جدول نگاه کنید. این ویژگیها باید در برچسب باز نوشته شوند.
.
ویژگی ها و ویژگی ها و |
1. خواص تراز = "پارامتر" - تراز یک سلول جداگانه را تنظیم می کند. می تواند مقادیر زیر را دریافت کند:
- تراز چپ - چپ
- تراز وسط - مرکز
- راست - تراز راست
2. ویژگی پس زمینه = "URL" - تصویر پس زمینه سلول را تنظیم می کند. به جای URL ، آدرس تصویر پس زمینه باید نوشته شود.
3. ویژگی bgcolor = "color" - رنگ پس زمینه سلول را تنظیم می کند.
4. ویژگی bordercolor = "رنگ" - رنگ حاشیه سلول را تنظیم می کند.
5. ویژگی char = "letter" - حرفی را تنظیم می کند که هم ترازی باید از آن انجام شود. مقدار ویژگی تراز باید روی char تنظیم شود.
6. Property colspan = "number" - تعداد سلولهای افقی را برای ترکیب تعیین می کند.
7. ارتفاع ویژگی = "تعداد" - ارتفاع جدول را تنظیم می کند: یا بر حسب پیکسل و یا بر حسب درصد.
8. عرض ویژگی = "تعداد" - عرض جدول را تنظیم می کند: یا بر حسب پیکسل و یا برحسب درصد.
9. Properties rowspan = "number" - تعداد سلولهای عمودی ادغام شده را تنظیم می کند.
10. ویژگی valign = "پارامتر" - تراز عمودی محتوای سلول.
- بالا - محتویات سلول را به بالای خط تراز می کند
- تراز وسط - وسط
- پایین - به پایین تراز کنید
- خط پایه - تراز پایه
یادداشت 1 برای برچسب | گزینه های مشابه موجود برای | ... پارامترهای یک برچسب | به صورت سلسله مراتبی برای همه اعمال خواهد شد درون آن
چگونه از چسبیدن سلول های میز به هم جلوگیری کنیم
در مورد استفاده از حاشیه (مرز سلول ها) و پر کردن صفر بین سلول ها ، آنها هنوز به هم چسبیده اند و یک حاشیه دوگانه دریافت می کنید. برای اجتناب از این امر ، باید جدول border-collaps: Collaps را در شیوه نامه ثبت کنید:
...
خواننده محترم ، اکنون اطلاعات بیشتری در مورد برچسب جدول html آموخته اید. اکنون به شما توصیه می کنم که به درس بعدی بروید.
کد منبع یک جدول HTML ساده
سلول 1 |
سلول 2 |
سلول 3 |
سلول 4 |
سلول 5 |
سلول 6 |
سلول 7 |
سلول 8 |
سلول 9 |
سرصفحه های جدول HTML
در جداول HTML 2 نوع سلول وجود دارد. برچسب سلولی از نوع معمول را تعریف می کند. اگر یک سلول به عنوان یک عنوان عمل کند ، با یک برچسب مشخص می شود.
مثال جدول HTML با عنوان th
| فولکس واگن AG |
دایملر AG |
گروه BMW |
|---|
| آئودی |
مرسدس بنز |
بی ام و |
| اشکودا |
مرسدس AMG |
مینی |
| لامبورگینی |
هوشمندانه |
رولز - رویس |
کد منبع جدول HTML با سرفصل های th
فولکس واگن AG |
دایملر AG |
گروه BMW |
|---|
آئودی |
مرسدس بنز |
بی ام و |
اشکودا |
مرسدس AMG |
مینی |
لامبورگینی |
هوشمندانه |
رولز - رویس |
سلولها را در یک جدول HTML به هم متصل کنید
جداول HTML قابلیت ترکیب سلول ها به صورت افقی و عمودی را دارند.
به سلولها را به صورت افقی ادغام کنیداز ویژگی colspan = "استفاده کنید NS"، در سلول یا ، جایی ایکس
به سلولها را به صورت عمودی ادغام کنیداز ویژگی rowspan = "استفاده کنید NS"، در سلول یا ، جایی ایکس- تعداد سلولهایی که باید ترکیب شوند.
سلول ها را می توان به صورت افقی و عمودی به طور همزمان ادغام کرد. برای انجام این کار ، از دو ویژگی colspan و rowspan برای سلول مورد نظر استفاده کنید:
متن سلول |
توجه داشته باشید که هنگام ادغام سلول ها ، تعداد موارد در سطر تغییر می کند. به عنوان مثال ، اگر یک جدول دارای 3 ستون با سلول باشد و سلولهای اول و دوم را با هم ترکیب کنیم ، در داخل تگ 2 عنصر وجود دارد که این سطر را مشخص می کند ، اولین آنها شامل ویژگی colspan = "2" است.
مثال جدول HTML با الحاق سلول
منبع جدول HTML با سلولهای ادغام شده
نیسان |
|---|
مدل |
تجهیزات |
دسترسی |
|---|
نیسان قشقایی |
ویزا |
+ |
تکنا |
+ |
نیسان ایکس تریل |
ACENTA |
+ |
CONNECTA |
- |
سرصفحه و پاورقی و امضا در جداول HTML
جداول HTML را می توان به 3 قسمت تقسیم کرد: سرصفحه ، بدنه ، پاورقی.
این کار با پیچاندن سطرهای قسمت انتخابی جدول با برچسب ها انجام می شود. ناحیه سرصفحه ، - ناحیه پاورقی ، - بدنه جدول را مشخص می کند.
به طور پیش فرض ، سرصفحه ها و پاورقی ها دارای سبک نیستند (در صورت نیاز می توان این کار را از طریق CSS انجام داد) ، اما می توانند توسط مرورگرها استفاده شوند. به عنوان مثال ، هنگام چاپ یک جدول چند صفحه ای ، ممکن است سرصفحه ها و پاورقی ها در هر صفحه چاپ شده کپی شوند.
ترتیب صحیح قرار دادن برچسب های منطقه در کد HTML جدول به شرح زیر است: ابتدا سرصفحه ، سپس پاورقی ، سپس بدنه اصلی. در این حالت ، قسمت اصلی صفحه بین سرصفحه و پاورقی نمایش داده می شود.
در صورت نیاز می توانید یک امضا به جدول اضافه کنید. برای این کار از تگ استفاده کنید.
مثال جدول HTML با سرصفحه و پاورقی و امضا
کد منبع برای جدول با سرصفحه و پاورقی و امضا
مجموعه کامل رنو ساندرو استپ وی
مشخصه |
SUTA 09H 6R |
SUTA 09HR6R |
SUTA 15H 5R |
|---|
دسترسی |
+ |
+ |
+ |
|---|
قدرت موتور |
0.9 (90 اسب بخار) |
0.9 (90 اسب بخار) |
1.5 (90 اسب بخار) |
|---|
سوخت |
بنزین |
بنزین |
دیزل |
|---|
میزان سمیت |
یورو 6 |
یورو 6 |
یورو 5 |
|---|
ستون ها و گروه های ستون
جدول HTML را می توان با استفاده از برچسب های and به ستون ها و گروه های ستونی تقسیم کرد.
این تفکیک به شما این امکان را می دهد که با استفاده از حداقل تعداد ویژگی CSS ، سبک هایی را برای جدول تنظیم کنید و در نتیجه میزان کد جدول را کاهش دهید (به جای تعریف سبک ها برای هر سلول در یک ستون ، می توانید سبک ها را برای یک یا چند ستون به طور همزمان تنظیم کنید).
برچسب ها و داخل برچسب قبل از برچسب ها ، AKP6 (EDC) انتقال |
جدول HTML منبع c و
ZEN 2E2C AL A |
ZEN 2E2C J5 A |
INTENSE 2E3C AL A |
مشخصه |
|---|
1.5 (90 اسب بخار) |
1.2 (115 اسب بخار) |
1.5 (90 اسب بخار) |
قدرت موتور |
|---|
دیزل |
بنزین |
دیزل |
سوخت |
|---|
AKP6 (EDC) |
AKP6 (EDC) |
AKP6 (EDC) |
انتقال |
|---|
جداول در چیدمان صفحه سایت
در سایت های مدرن ، نمایش صحیح صفحات هم در رایانه و هم در دستگاه های تلفن همراه بسیار مهم است. توصیه نمی شود از جداول برای ایجاد اسکلت یک صفحه HTML استفاده کنید ، زیرا توانایی انطباق محتوا با صفحه های مختلف (رایانه ، تلفن های هوشمند ، رایانه لوحی) از بین می رود.
از برچسب های گروه Table برای نمایش محتویات قالب بندی شده در صفحه بهتر استفاده می شود.
| |
|
| | |
|
