آدرس : تهران میدان فردوسی خیابان ایرانشهر بین سمیه و طالقانی مجتمع تجاری میلاد واحد 9

پشتیبانی 24 ساعته : 02188867940 – 09927674217

فروشنده باشید

برای مشاهده لیست علاقه مندی ها وارد شوید!

مشاهده محصولات فروشگاه
0

هیچ محصولی در سبد خرید نیست.

تعریف سطرها و ستون های جدول

دسته بندی :دسته‌بندی نشده 29 نوامبر 2022 علیرضا بابامرادی 1465

تعریف سطرها و ستون های جدول

اگر با نرم افزارهای صفحه گسترده استاندارد مانند Microsoft Excel یا Apple Numbers آشنایی دارید، شما به تعریف جداول با استفاده از سلول هایی که با حروف ارجاع داده شده اند عادت دارید (برای ستون ها) و اعداد (برای ستون ها). متأسفانه HTML5 از a استفاده می کند روش های مختلف برای تعریف سلول های جدول برای ساخت سلول ها در یک جدول باید دو عنصر جداگانه تعریف کنید:

»»یک ردیف در جدول: از عنصر tr برای تعریف سطر داخل جدول استفاده می کنید.

عنصر tr یک عنصر دو طرفه است، بنابراین از تگ <tr> برای باز کردن یک ردیف استفاده می کنید و تگ </tr> برای بستن سطر.

»»سلول داخل سطر: در داخل سطر از عنصر td برای تعریف استفاده می کنید

سلول های منفرد مجدداً، عنصر td دو طرفه است، بنابراین از تگ <td> استفاده می کنید

یک سلول و تگ </td> را برای بستن یک سلول باز کنید. بنابراین، با تمام این اطلاعات، می توانید اولین جدول خود را ایجاد کنید. فقط این مراحل را دنبال کنید:

1. ویرایشگر متن، ویرایشگر برنامه یا بسته IDE خود را باز کنید و کد زیر را تایپ کنید:

<!DOCTYPE html>

<html>

<head>

<title>My First Table</title>

</head>

<body>

<h1>Bowling Scores</h1>

<table>

<tr>

<td>Bowler</td>

<td>Game 1</td>

<td>Game 2</td>

<td>Game 3</td>

<td>Average</td>

</tr>

<tr>

<td>Rich</td>

<td>100</td>

<td>110</td>

<td>95</td>

<td>102</td>

</tr>

<tr>

<td>Barbara</td>

<td>110</td>

<td>105</td>

<td>103</td>

<td>106</td>

</tr>

<tr>

<td>Katie</td>

<td>120</td>

<td>125</td>

<td>115</td>

<td>120</td>

</tr>

<tr>

<td>Jessica</td>

<td>115</td>

<td>120</td>

<td>120</td>

<td>118</td>

</tr>

</table>

</body>

</html>

2. فایل را در پوشه XAMPP DocumentRoot به عنوان mytable.html ذخیره کنید.

3. مطمئن شوید که سرورهای XAMPP در حال اجرا هستند.

4. مرورگر خود را باز کنید و آدرس زیر را وارد کنید:

http://localhost:8080/mytable.html

ممکن است لازم باشد شماره پورت 8080 را در URL تغییر دهید تا با وب سرور آپاچی در تنظیمات شما مطابقت داشته باشد.

هنگامی که صفحه وب را نمایش می دهید.

به طور پیش فرض، جدول حاوی هیچ خط شبکه ای نیست، اما همانطور که در فصل بعد می بینید، می توانید آن را با استفاده از CSS تغییر دهید. همچنین، عناوین ستون های جدول فقط ظاهر می شوند مانند ردیف های داده بعدش شما درستش کنید تعریف سرفصل‌های جدول می‌توانید با استفاده از آن، قالب‌بندی خاصی را بدون استفاده از CSS روی سرفصل‌های جدول اعمال کنید.

عنصر th به جای عنصر td برای سلول های عنوان:

<tr>

<th>Bowler</th>

<th>Game 1</th>

<th>Game 2</th>

<th>Game 3</th>

<th>Average</th>

</tr>

عنصر th باعث می شود که مرورگر سلول های عنوان را با استفاده از یک فونت پررنگ نمایش دهد. اغلب، در جداول، با موقعیت‌هایی مواجه می‌شوید که یک سلول داده باید دو یا بیشتر را شامل شود ستون ها یا ردیف ها شما می توانید آن را در جداول HTML5 خود با استفاده از rowspan تقلید کنید و ویژگی های colspan در تگ  tdرای گسترش دو یا چند ردیف در یک سلول داده، فقط ویژگی rowspan را اضافه کنید و تعداد سطرها را برای باز کردن مشخص کنید.

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

<tr>

<td>Rich</td>

<td rowspan=4>100</td>

<td>110</td>

<td>95</td>

<td>102</td>

</tr>

برچسب‌ها:, , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , , ,
علیرضا بابامرادی
تاریخ عضویت:19 سپتامبر 2022

راه آسان‌تری برای ارتباط با کاربران‌مان پیدا کرده‌ایم :) عضویت در کانال

مطالب زیر را حتما بخوانید:

قوانین ارسال دیدگاه در سایت

  • چنانچه دیدگاهی توهین آمیز باشد تایید نخواهد شد.
  • چنانچه دیدگاه شما جنبه ی تبلیغاتی داشته باشد تایید نخواهد شد.
  • چنانچه از لینک سایر وبسایت ها و یا وبسایت خود در دیدگاه استفاده کرده باشید تایید نخواهد شد.
  • چنانچه در دیدگاه خود از شماره تماس، ایمیل و آیدی تلگرام استفاده کرده باشید تایید نخواهد شد.
  • چنانچه دیدگاهی بی ارتباط با موضوع آموزش مطرح شود تایید نخواهد شد.

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

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

لینک کوتاه:
عضویت در خبرنامه سایت

تمامی اطلاعات شما نزد ما با بسیار بالا محفوظ خواهد بود.

مزایای عضویت در سیگما:

  • ● دسترسی به فایل های دانلودی
  • ● اعتبار هدیه به ارزش 50 هزار تومان
  • ● دسترسی آسان به آپدیت محصولات
  • ● دریافت پشتیبانی برای محصولات
  • ● بهره مندی از تخفیف های ویژه کاربران
عضویت در سایت

نوشته‌های تازه

آخرین دیدگاه‌ها

    دسته بندی مطالب

    لینک های کمکی

    خدمات اداری

    خدمات تیم نهال آی تی

    خدمات تیم نهال آی تی

    نماد اعتماد الکترونیکی

    جزو اتحادیه کسب و کار های مجازی

    logo-samandehi
      توسعه و پشتیبانی : بهینه سازان سرزمین هوشمند
    توسعه : سرزمین هوشمند
    0