فصل 4

جداول در HTML.

یکی از قوی ترین و به طور گسترده ای در بودامهای HTML جداول است. مفهوم ارائه داده های جدولی به توضیح اضافی نیاز ندارد. جداول HTML نه تنها به طور سنتی به عنوان یک روش نمایندگی داده، بلکه به عنوان وسیله ای برای قالب بندی صفحات وب استفاده می شود. ما نمونه هایی از اسناد موجود موجود را ارائه می دهیم که در آن یک دیدگاه جدولی یک راه مناسب برای ساخت یک سند است. در شکل 4.1 یک نمونه معمولی از استفاده از جداول را برای نشان دادن داده های عددی شکسته از طریق ردیف ها و ستون ها نشان می دهد. در شکل 4.2 استفاده از جدول فقط اشیاء قالب بندی یک سند را اجرا می کند، موقعیت متقابل عناصر صفحه را تنظیم می کند. هنگام مشاهده چنین سند، بلافاصله دیده نمی شود که یک جدول برای ساخت آن استفاده شود، زیرا فریم های اطراف سلول های آن کشیده نشده اند.

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

و

آن را توسط فونت مونوسین نمایش داده می شود، و تمام شکاف ها و زبانه ها معنی دار هستند. کار بر روی برابر همان متن به صورت دستی انجام شد، که به طور قابل توجهی باعث ایجاد اسناد شد. پشتیبانی از ارائه جدول داده ها به استاندارد واقعی تبدیل شده است، زیرا در ابتدا در تمام مرورگرهای پیشرو اجرا شد و تنها پس از زمان قابل توجهی در مشخصات HTML 3.2 ثابت شد.

با این حال، ابزار ویژه ای برای ایجاد جداول، استفاده از متن شبیه سازی شده را لغو نمی کند. استفاده از جداول محدود به داده های متشکل از ردیف ها و ستون ها نیست. یکی از برنامه های کاربردی، سازمان موقعیتی از داده های مختلف در صفحه است که ممکن است شامل متن ساده، تصاویر، جداول دیگر و غیره باشد. قوانین برای ایجاد جداول و نمونه هایی از استفاده از آنها به این فصل اختصاص داده شده است.

شکل . 4.1. مثال معمولی جدول HTML

شکل . 4.2. جدول نمونه بدون فریم

ایجاد ساده ترین جداول HTML

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

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

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

هر خط شروع به برچسب می کند (ردیف جدول) و با برچسب به پایان رسید. یک سلول جداگانه در رشته توسط یک جفت برچسب طراحی شده است و (داده های جدول) یا و (هدر جدول). تگ معمولا برای سلول های هدر جدول استفاده می شود، و - برای سلول های داده. تفاوت در استفاده فقط در نوع فونت مورد استفاده به طور پیش فرض برای نمایش محتویات سلول ها، و همچنین محل داده ها داخل سلول است. محتویات سلول های نوع فونت جسورانه (Bold) را نمایش می دهد و در مرکز قرار دارد (align \u003d center، valign \u003d middle). سلول های برچسب به طور پیش فرض، داده های هماهنگ شده به سمت چپ نمایش داده می شود (align \u003d left) و در وسط (valign \u003d middle) در جهت عمودی.

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

تعداد ردیف ها در جدول توسط تعداد تگ های باز شده تعیین می شود ، و تعداد ستون ها - حداکثر تعداد یا در میان تمام خطوط بخشی از سلول ها ممکن است حاوی هیچ داده ای نباشد، چنین سلول هایی با یک جفت برچسب های زیر توصیف می شوند - , . اگر یک یا چند سلول که در انتهای هر رشته قرار دارند، حاوی داده ها نیستند، سپس توصیف آنها ممکن است حذف شود، و مرورگر به طور خودکار مقدار مورد نیاز سلول های خالی را اضافه می کند. این به این معنی است که ساخت جداول که در آن در سکته های مختلف وجود دارد، تعداد دیگری از ستون های مشابه وجود دارد مجاز نیست.

جدول ممکن است یک عنوان داشته باشد که یک زن و شوهر از برچسب ها است و. جدول هدر جدول باید در داخل برچسب ها قرار گیرد

و در هر نقطه، در خارج از شرح هر یک از برچسب ها , یا . با توجه به مشخصات زبان HTML، توصیف توضیحات به طور مرتب سرفصل است: باید بلافاصله پس از برچسب قرار گیرد و قبل از اولین . ما توصیه می کنیم به این قانون پایبند باشید.

به طور پیش فرض، متن هدر جدول بالای آن قرار دارد (align \u003d top) و در جهت افقی قرار دارد.

برچسب های ذکر شده ممکن است پارامترها، تعداد و مقادیر متفاوت باشد. با این حال، در ساده ترین مورد، برچسب ها بدون پارامترهایی که مقادیر پیش فرض را قبول می کنند استفاده می شود.

این اطلاعات به اندازه کافی برای ساخت جداول ابتدایی است. ما نمونه ای از ساده ترین جدول را شامل دو ردیف و دو ستون می دهیم، صفحه نمایش آن در شکل نشان داده شده است. 4.3.

سلول 1 خط 1	سلول 2 ردیف 1
سلول 1 خط 2	سلول 2 ردیف 2

شکل. 4.S. مثال ساده ترین جدول

نمایش جدول در صفحه

تخصیص پارامترهای مختلف را که می توان در برچسب های توصیف جداول استفاده کرد، در نظر بگیرید.

عنوان جدول

جدول هدر برچسب این یک پارامتر مجاز مجاز است که مقادیر گشتاور (عنوان بیش از جدول) یا پایین (عنوان زیر جدول) را پذیرفته است. پارامتر ALIGN را می توان حذف کرد، که مربوط به مقدار align \u003d بالا است. در جهت افقی، عنوان جدول همیشه در مرکز آن واقع شده است. جدول ممکن است یک هدر نداشته باشد. به عنوان یک هدر جدول، در اغلب موارد، متن ساده استفاده می شود، که توسط مشخصات HTML اداره می شود، اما در واقعیت بین برچسب ها و قابل مشاهده برای ضبط هر عنصر HTML مورد استفاده در بخش . بگذارید نمونه ای از رکورد عنوان جدول را ارائه دهیم:

عنوان، واقع در پایین LAD

اگر این توضیحات هدر به مثال بالا افزوده شود، جدول نمایش داده می شود همانطور که در شکل نشان داده شده است. 4.4.

شکل. 4.4.جدول با عنوان

مرورگر مایکروسافت اینترنت اکسپلورر ویژگی های اضافی را برای انتخاب محل عنوان ارائه می دهد. پارامتر ALIGN اجازه می دهد تا مقادیر چپ، مرکز و راست برای هماهنگی افقی همراه با مقادیر که در بالا شرح داده شده است. توجه داشته باشید که این یکی از موارد نادر است، زمانی که پارامتر گسترده تر هماهنگی برای تراز افقی و عمودی استفاده می شود. به عنوان مثال، رکورد align \u003d راست، ترتیب عنوان را به سمت راست فشار می دهد و روی میز قرار می گیرد. اگر شما نوشتن align \u003d پایین را بنویسید، سپس همانند در مثال بالا، عنوان زیر جدول قرار می گیرد. با این حال، استفاده دوگانه در یک عنوان پارامتر ALIGN غیر قابل قبول است. بنابراین، پارامتر ویژه برای هماهنگی عمودی علاوه بر معرفی - Valign، که مقادیر گشتاور یا پایین را می گیرد. به عنوان مثال، برای عنوان، در پایین جدول با هم ترازی به سمت چپ، شرح دارای فرم زیر است:

عنوان، واقع در پایین با هم تراز به سمت چپ

جدول با شرح عنوان در مایکروسافت اینترنت اکسپلورر به شرح زیر نمایش داده خواهد شد (شکل 4.5). اگر این مثال در Netscape مشاهده شود، عنوان به طور پیش فرض به طور پیش فرض قرار می گیرد، به عنوان مثال در بالای جدول و در وسط در جهت افقی قرار می گیرد.

شکل. 4.5. جدول جدول جدول ترازو افقی مرورگر مایکروسافت اینترنت اکسپلورر

قابلیت هماهنگی افقی جدول Header دارای فرمت مشخصات HTML است، که توسط مرورگر Netscape Navigator پشتیبانی نمی شود، و بنابراین آنها باید فقط در نیاز شدید استفاده شوند.

پارامترهای برچسب

برچسب اصلی هنگام ایجاد جداول برچسب گذاری شده است

. این را می توان با تعدادی از پارامترها مورد استفاده قرار داد، که هر کدام مجاز به حذف هستند. مجموعه ای از پارامترهای مجاز بستگی به مرورگر دارد. با توجه به مشخصات HTML در برچسب پارامترهای زیر می تواند مورد استفاده قرار گیرد: مرز، سلول ها، سلول های سلولی، عرض، تراز کردن. Netscape Imicrosoft Internet Explorer مرورگرهای علاوه بر پنج پارامتر زیر برای استفاده از پارامترهای ارتفاع و BGColor مجاز است. مرورگرهای جداگانه همچنین به شما اجازه می دهد تا پارامترهای دیگر را مشخص کنید. قرار ملاقات پارامترهای معمول استفاده شده را در نظر بگیرید .

پارامتر مرزی

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

برای اضافه کردن به جدول قاب، شما باید در کد فعال کنید

پارامتر مرزی که ممکن است مقدار عددی داشته باشد.

مثلا،

یا .

مقدار عددی پارامتر ضخامت قاب را در پیکسل های کشیده شده در اطراف کل جدول تعیین می کند، اما ضخامت فریم های اطراف هر سلول را تحت تاثیر قرار نمی دهد. در غیاب یک مقدار عددی، معمولا برابر با حداقل مقدار (1) برابر است، اگر چه برای مرورگرهای مختلف، سبک صفحه نمایش قاب ممکن است متفاوت باشد. امکان کنترل مستقل صفحه نمایش فریم در اطراف کل جدول و فریم های اطراف سلول ها از دست رفته است.

یک نمونه از یک جدول با یک چارچوب ضخامت 10 پیکسل در شکل نشان داده شده است. 4.6.

شکل. 4.6.جدول با ضخامت قاب 10 پیکسل

مشخصات HTML 3.0 شامل ارزش برای پارامتر مرزی نیست. این تنها در HTML 3.2 انجام می شود. بنابراین، به ویژه، نسخه های اولیه مایکروسافت اینترنت اکسپلورر اجازه نمی داد تنظیمات مقدار عددی.

توجه داشته باشید که در غیاب پارامتر مرزی، فریم ها کشیده نشده اند، اما زیر آنها باقی مانده است (این فقط به Netscape اعمال می شود). اندازه کل جدول در غیاب پارامتر مرزی یا حضور آن تغییر نمی کند (استثناء مورد مرز کار \u003d 0 است). بنابراین، حداقل فاصله بین دو سلول مجاور در این موارد برابر با دو برابر ضخامت قاب، I.E. دو پیکسل است. سلول ها را به عنوان نزدیک به یکدیگر قرار دهید. ممکن است مرز کار \u003d 0 باشد، که به معنی فقدان چارچوب است. برخی از مرورگرها ممکن است از وظیفه عددی ارزش پارامتر مرزی پشتیبانی نکنند، سپس مقدار برابر صفر نادیده گرفته می شود، و جدول با فریم ها کشیده می شود.

اجازه دهید ما چند نمونه را ارائه دهیم:

هر سه مرورگر Netscape فوق ذکر شده متفاوت خواهد بود. توجه داشته باشید که در اینجا یک مورد نسبتا منحصر به فرد وجود دارد، زمانی که شما نمی توانید در مورد مقدار پیش فرض صحبت کنید. مثال سوم که در آن پارامتر مرزی حذف می شود، از هر نمونه ای که این پارامتر وجود دارد متفاوت است. برای مایکروسافت اینترنت اکسپلورر، نمونه های دوم و سوم یکسان هستند، بنابراین برای این مرورگر، مقدار پیش فرض پارامتر مرزی صفر است.

CellSpacing پارامتر

فرم ضبط پارامتر: cellspacing \u003d num، جایی که Num مقدار عددی پارامتر در پیکسل است که نمی تواند حذف شود. مقدار عدد فاصله بین سلول های مجاور (دقیق تر بین سلول های سلول) را به صورت افقی و عمودی تعیین می کند. به طور پیش فرض، مقدار برابر با دو برابر است. توجه داشته باشید که به طور سنتی در سیستم های انتشارات سلول های مجاور جداول یک مرز مشترک دارند. در جداول HTML، مکان پیش فرض بین آنها قرار دارد، که به وضوح در شکل بالا قابل مشاهده است (شکل 4.6). هنگام مشخص کردن cellspacing \u003d 0 فریم از سلول های مجاور، جدول یکنواخت جدول ایجاد شده و ایجاد می شود (شکل 4.7).

شکل. 4.7.جدول با cellspacing \u003d 0

سرهم بندی

فرم ضبط پارامتر شبیه به سلول ها است. مقدار عدد اندازه فضای آزاد (ضخامت) بین فریم سلولی و داده های داخل سلول را تعیین می کند. به طور پیش فرض، مقدار برابر با یک برابر است. تنظیم پارامتر cellpadding به صفر می تواند منجر به این واقعیت شود که برخی از بخش های متن سلول ممکن است قاب آن را لمس کند، که به نظر می رسد بسیار زیبایی شناختی نیست.

در شکل 4.8 یک نمونه از یک جدول را با مقدار cellpadding \u003d 10 نشان می دهد.

شکل. 4.8.جدول با cellpadding \u003d 10

پارامترهای Cellpadding و CellSpacing بسیار شبیه به یکدیگر هستند. برای یک میز بدون فریم، تغییر یک پارامتر یا یک پارامتر دیگر منجر به همان نتیجه می شود. هر دو پارامتر به طور همزمان به صورت افقی و عمودی تاثیر می گذارد. متاسفانه، کنترل جداگانه ای از عقب نشینی های افقی و عمودی به عنوان مثال، برای مثال، برای نشان دادن از تصاویر (پارامترهای HSPACE و برچسب VSPACE ) ارائه نشده است.

هر سه پارامتر - مرز، همبستگی و سلول های تراشه به طور مستقل از یکدیگر عمل می کنند، اگر هر کدام از آنها حذف شوند، ارزش آن به طور پیش فرض گرفته شده است. به طور خاص، اگر تمام پارامترهای ذکر شده حذف شوند، حداقل فاصله بین داده ها از سلول های مجاور 6 پیکسل (برای Netscape) خواهد بود. این مقدار شامل دو پیکسل برای CellSpacing، یک پیکسل برای سلول های انباشته شده و یک پیکسل برای قاب هر سلول است. جدول جمع و جور با استفاده از وظیفه شرح زیر به دست می آید:

فقط در این سلول های نوع نزدیک به یکدیگر قرار می گیرند. یک مثال از استفاده از یک جدول، تمام سلول هایی که حاوی نقاشی های مشابه هستند، باید در کنار یکدیگر قرار گیرند.

پارامترهای عرض و ارتفاع

هنگامی که جداول نمایش داده می شود، عرض و ارتفاع آنها به طور خودکار توسط مرورگر محاسبه می شود و به عوامل بسیاری بستگی دارد: مقادیر پارامتر مشخص شده در توضیح کل سند داده شده به جدول، خطوط فردی و سلول ها، محتویات سلول ها ، و همچنین پارامترهای مشخص شده هنگام مشاهده یک سند در یک مرورگر دیگر، به عنوان مثال، نوع و اندازه فونت، اندازه پنجره مشاهده و غیره، زمانی که شما نمایش محاسبه اندازه جداول به طور خودکار انجام می شود، با توجه به این عوامل، تلاش برای ارسال یک جدول در راحت ترین راه - برای قرار دادن جدول به طوری که آن را قرار داده شده و پنجره مشاهده. طرح کلی مشاهده برای اسناد بزرگ به عنوان یک قاعده، به پیمایش خطی محتویات سند عمودی و خواندن متن، تفسیر شده توسط جداول مختلف، تصاویر و غیره کاهش می یابد. این امر به هر دو اسناد HTML و اسناد متعارف ایجاد شده در آن اعمال می شود هر ویرایشگر متن اکثر هر دو ویراستار متن (به عنوان مثال، مایکروسافت ورد) و مرورگرهای HTML به طور خودکار متن را فرمت می کنند تا (در صورت امکان) به طوری که طول رشته از عرض پنجره مشاهده نمی شود. این از نیاز به پیمایش افقی سند اجتناب می کند. اقدامات مشابه با مرورگرها با جداول ساخته شده اند - در صورت امکان، آنها را به گونه ای فرمت کنید که عرض جدول از عرض پنجره مشاهده نمی شود. می توان نتیجه گرفت که عرض جداول مهم تر است، پارامتر اولیه، محاسبه آن به طور عمده در مقایسه با ارتفاع انجام می شود.

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

. فرم ضبط: عرض \u003d num یا عرض \u003d num٪، جایی که شماره عددی عددی از عرض کل جدول در پیکسل یا به عنوان یک درصد از کل اندازه پنجره است. توجه داشته باشید که مجاز به تنظیم مقادیر، 100٪ بزرگ است، اگر چه دشوار است تصور کنید که مورد نیاز است. مثال:

.

پارامترهای مشابه را می توان برای سلول های فردی تنظیم کرد. توجه داشته باشید که تنظیم مقدار خاصی از پارامتر، به عنوان مثال، عرض \u003d 200 به این معنا نیست که جدول در هر صورت دارای عرض مشخص شده است، اما تنها عرض توصیه شده را تعریف می کند که در صورت امکان مقاومت خواهد کرد. بگذارید آن را بر روی نمونه ها توضیح دهیم. فرض کنید یک جدول وجود دارد که در این شرایط به طور پیش فرض عرض کوچکتر از مشخص شده است. در این مورد، مرورگر عرض جدول را به وسیله گسترش متناسب تمام ستون های جدول افزایش می دهد. هنگامی که پنجره مشاهده محدود می شود، عرض جدول تغییر نخواهد کرد، و ممکن است لازم باشد آن را یک پیمایش افقی مشاهده کنید. اگر جدول پیش فرض دارای عرض بزرگتر از مشخص شده باشد، مرورگر تلاش می کند تا عرض آن را کاهش دهد، در مرحله اول، عرض ستون های فردی را کاهش دهید که عرض مشخص شده مورد نیاز است، دوم، تقسیم متن در سلول های جداگانه چندین ردیف با افزایش ارتفاع جدول. این اقدامات ممکن است اندازه جدول مورد نظر را ارائه ندهد، و سپس حداقل عرض ممکن را داشته باشد. اقدامات مشابه برای جداول ساخته شده است که ابعاد را مشخص نمی کنند، زمانی که پنجره مشاهده محدود می شود.

الگوریتم های پیکربندی جدول خاص برای مرورگرهای مختلف ممکن است کمی متفاوت باشد.

پارامتر هماهنگ کردن

این برچسب پارامتر

مکان افقی جدول را در نمای Viewport مشخص می کند. مقادیر معتبر - چپ (چپ) و راست (تراز کردن سمت راست). به طور پیش فرض، جدول در لبه سمت چپ قرار دارد. توجه داشته باشید که در میان مقادیر مجاز ارزش معمول برای پارامتر هماهنگی وجود ندارد. در برخی منابع در زبان HTML، مرکز (محور) در این مورد مجاز است. این مربوط به مشخصات HTML است، اما در عمل و Netscape Navigator، و مایکروسافت اینترنت اکسپلورر تنها دو ارزش را اجرا می کند. واقعیت این است که حضور پارامتر ALIGN در برچسب نه تنها محل جدول را تعیین می کند، بلکه به شما اجازه می دهد تا جریان را در اطراف جدول با متن از طرف مقابل شبیه به ساده سازی تصاویر انجام دهید. جریان در اطراف جدول با متن در هر دو طرف در هر مورد پیش بینی نشده است. برای مدیریت جریان دقیق تر باید از یک برچسب استفاده کنید
با پارامتر روشن و همچنین برای آن انجام می شود . اگر پارامتر ALIGN حذف شود، مکان در سمت راست و / یا به سمت چپ جدول همیشه بدون در نظر گرفتن عرض آن خالی خواهد بود. اگر جدول نیاز به جریان متن نداشته باشد، می توانید مکان خود را در پنجره مشاهده به دست آورید. برای این، به عنوان مثال، شما می توانید شرح جدول را در داخل جفت برچسب ها ایجاد کنید. و.

ما نمونه ای از جدول را با متن جریان ارائه می دهیم، صفحه نمایش آن در شکل نشان داده شده است. 4.9.

بزرگسالان

جمعیت سن پترزبورگ

ابرام الکساندر الکسی آلبرت آناتولی اندرو arkady بوریس وادیم ولنتاین والری ریحان ویکتور ویتالی ولادیمیر ولادیسلاو vyacheslav گنادی ژئوری هرمان گرگوری دیمیتری

اونی افسانه ایوان ایگور il ya جوزف کنستانتین یک شیر لئونید مایکل نیکولای اولگ قله پیتر رمان منی سرگیجی stanislav ادوارد یوری یکوف

مشخص شده 43 نام رایج ترین پوشش 92٪ نمونه را پوشش می دهد.

شکل. 4.9. جدول بدون فریم با متن جریان

این سند شامل یک جدول بدون چارچوب با align \u003d پارامتر تراز بندی چپ است که اجازه می دهد تا متن زیر جدول به سمت راست آن. جدول شامل تنها یک خط است که حاوی دو سلول است. هر سلول شامل بخشی از یک لیست غیر اندازه گیری شده است.

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

تصمیم نامعتبر

ما یک مثال کوچک دیگر برای ایجاد یک صفحه مشابه، صفحه نمایش نشان داده شده در شکل نشان داده شده است. 4.10.

شایع ترین نام انسان

جمعیت بالغ سنت پترزبورگ

ابرام الکساندر الکسی آلبرت آناتولی اندرو arkady بوریس وادیم ولنتاین والری ریحان ویکتور ویتالی ولادیمیر ولادیسلاو vyacheslav گنادی ژئوری هرمان گرگوری دیمیتری

اونی افسانه ایوان ایگور ایلیا اندیشه کنستانتین یک شیر لئونید مایکل هیالی اولگ قله پیتر رمان منی سرگیجی stanislav ادوارد یوری یکوف

این داده ها بر اساس تجزیه و تحلیل نمونه های نماینده حاوی اطلاعات حدود 5000 مرد بالای 18 سال، در سن پترزبورگ زندگی می کنند. مشخص شده 43 اغلب مواجه شده 92٪ از نمونه است. فراوانی وقوع هر یک از نام های دیگر از 0.3٪ تجاوز نمی کند



شکل. 4.10. جدول بدون فریم حاوی سه ستون

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

قالب بندی داده ها در داخل جدول

هر سلول جداگانه داخل جدول را می توان به عنوان یک منطقه قالب بندی مستقل مشاهده کرد. تمام قوانینی که برای مدیریت صفحه نمایش متن عمل می کنند می توانند برای قالب بندی متن درون سلول استفاده شوند. در داخل سلول مجاز به استفاده از تقریبا تمام عناصر HTML است که می تواند در داخل بدن از سند ظاهر شود ، از جمله برچسب هایی که محل متن را مدیریت می کنند -

,
,

---

، کدهای سرپوش - از

قبل از

، برچسب های قالب بندی نماد<В>, , , , , , ، tegivestages لینک های Hypertext<А> و غیره بلافاصله تاکید بر اینکه دامنه تگ های مشخص شده در یک سلول جداگانه محدود به محدودیت های این سلول صرف نظر از حضور تگ نهایی محدود می شود. به عنوان مثال، اگر رنگ متن در داخل سلول تعریف شود - ، حتی اگر کد اتمام وجود ندارد یا آن را از طریق چندین سلول یا ردیف یک جدول ترتیب دهید، متن سلول زیر توسط رنگ پیش فرض منعکس می شود.

برای قالب بندی داده ها در سلول های جدول، پارامترهای زیر ارائه شده است.

محتوای تراز بندی محتویات سلول ها هماهنگی و valign است. می تواند در کدهای استفاده شود , و . پارامتر هماهنگی افقی افقی ممکن است مقادیر چپ، راست و مرکز را دریافت کند (به طور پیش فرض به سمت چپ و مرکز برای ) پارامتر هم ترازی عمودی Valign می تواند مقادیر توراس (در لبه بالا)، پایین (در لبه پایین)، وسط (در وسط)، پایه (بر اساس پایه). پیش فرض - وسط همبستگی پایه، اتصال متن یک خط جداگانه را در تمام سلول ها به یک خط واحد تضمین می کند. پارامترهای سطح بندی را در سطح کد تنظیم کنید تنظیم هماهنگی برای تمام سلول های این خط، در حالی که در هر سلول سلول فردی رشته، پارامترهای آنها تعریف پارامترهای مشخص شده در .

بگذارید نمونه ای از یک جدول را ارائه دهیم که در آن داده ها در سلول های ستون اول به سمت راست، ستون دوم - در مرکز، و سوم - سمت چپ (مقدار پیش فرض)

سلول 1.	تقلب 2	سلول 3
Yachika 4.	سلول 5	سلول 6.

صفحه نمایش این مثال مرورگر در شکل نشان داده شده است. 4.11.




شکل. 4.11.هماهنگ کردن داده ها در سلول های جدول

پارامتر NOWRAP توانایی را به طور خودکار متن سلول را به رشته تقسیم می کند. می تواند در کدهای استفاده شود , و . کاربرد غیرقابل قبول این پارامتر باید اجتناب شود، زیرا می تواند به طور قابل توجهی امکان تغییرات پویا را در جداول کاهش دهد و درک آنها را بدتر کند. در اغلب موارد، به اندازه کافی برای استفاده از NowRap برای سلول های فردی است که واقعا نیاز به ممنوعیت انتقال کلمه به یک خط جدید دارد. انتقال کلمه تنها بر روی جداسان بین کلمات (فضاهای) انجام می شود و در برخی موارد، ممنوعیت پارگی متن در مکان های جداگانه، به جای یک نماد فضایی، کد فضای غیرقابل انکار را تنظیم می کند. به عنوان مثال، شما می توانید مواردی را که شکاف توصیه نمی شود، منجر شود - بین مقدار عددی و واحدهای اندازه گیری این مقدار؛ بین نام خانوادگی و حروف اول. بنابراین، متن 650 کیلومتر یا یلتسین B.N. توصیه می شود در فرم بنویسید650 کیلومتر و یلتسین B.N.

پارامترهای عرض و ارتفاع را می توان در کدهای استفاده کرد و . نحو آنها شبیه نحوی این پارامترها برای برچسب است

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

برای جداول پیچیده، نیاز به ترکیب چندین سلول مجاور به صورت افقی یا عمودی در یک مشخص می شود. این ویژگی با استفاده از Colspan (Coliimn spanning) و ROPPAN (ردیف ردیف) در کدهای اجرا می شود

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

در شکل 4.17 نتیجه پیاده سازی کد فوق را نشان می دهد، و همچنین گزینه نمایش این جدول با رکورد قوانین \u003d گروه ها در برچسب

یا

. فرم ضبط: colspan \u003d num، جایی که Num یک مقدار عددی است که تعیین می کند که تعداد ستون ها باید به سلول فعلی به صورت افقی گسترش یابد. استفاده از پارامتر Rowspan مشابه است، تنها در اینجا تعداد رشته هایی را مشخص می کند که باید سلول های عمودی فعلی را جذب کنند. به طور پیش فرض، مقدار برابر با یکی برای این پارامترها تنظیم شده است. تنظیم همزمان مجاز از مقادیر هر دو پارامتر برای یک سلول. تنظیم صحیح مقادیر این پارامترها ممکن است یک کار بسیار ساده باشد، به خصوص از آنجایی که اکثر ویراستاران HTML می توانند به صورت بصری با نسل بعدی از کدهای HTML تنها ساده ترین جداول ساخته شوند. در شکل 4.12 نمونه ای از نمایش جدول به دست آمده توسط کد HTML زیر را نشان می دهد: سلول گرفتن دو خط سلول، دو ستون اعتیاد آور است سلول 3 سلول 4 سلول 5 سلول 6. سلول 7 شکل. 4.12. جدول با سلول های پخش چند ردیف یا ستون وظیفه بی نظیر مقادیر پارامترهای لغزش سلولی می تواند منجر به همپوشانی متقابل و درگیری های متقابل شود، که در آن نتیجه غیر قابل پیش بینی است. استفاده مشخص از سلول های توسعه یافته یک هدر مشترک برای چند ستون یا خطوط مجاور است. ما نمونه ای از کد HTML را ارائه می دهیم (صفحه نمایش آن در شکل 4.13 نشان داده شده است، که در آن سلول های پیشرفته نادرست هستند. سلول 1. سلول 2 سلول 3 (مشترک هه سه خطوط) Yachika 4. سلول 5 سلول 6. سلول 7 (مشترک در دو ستون) شکل. 4.13.نتیجه تعریف نادرست سلول های پیشرفته (اعمال متن) پارامتر BGColor رنگ کل جدول، خطوط جداگانه یا سلول را تنظیم می کند. می تواند در برچسب ها ملاقات کند , , هیچ اطلاعاتی موجود نیست یا یک یا چند فضایی که به عنوان داده ها تفسیر نشده اند. برای مثال، سلولهای حاوی داده های نامرئی ممکن است حاوی کد یا کد ترجمه ردیف باشند ، یا هر متن که رنگ آن با رنگ پس زمینه سلولی همخوانی دارد. اگر سلول های حاوی داده ها (حتی اگر نامرئی) تمام مرورگرها را به طور مساوی نمایش داده شوند، سپس سلول های خالی متفاوت نمایش داده می شوند. مرورگر Netscape یک سلول خالی نیست، به عنوان مثال جایی که این سلول قرار دارد، با پس زمینه رنگ صفحه، و نه رنگ پس زمینه سلولی، در مقایسه با سلول های حاوی داده ها رنگ شده است. در اطراف سلول های خالی یک قاب را نمی کشند. یک نمونه از یک جدول با یک سلول خالی در شکل نشان داده شده است. 4.15. شکل. 4.15. جدول جدول خالی در مرورگرهای مختلف مختلف نمایش داده می شود مایکروسافت اینترنت اکسپلورر و آن ها و سایر سلول ها رنگ پس زمینه سلول را نمایش می دهد. چنین مرورگر به عنوان NSCA Mosaic کاربر را قادر می سازد تا ماهیت صدور سلول های جدول خالی را با انتخاب گزینه های مناسب تعیین کند. دانش از این ویژگی ها به شما این امکان را می دهد که جداول را توسعه دهید که به صورت مناسب نمایش داده می شود، صرف نظر از مرورگر انتخاب شده توسط کاربر. در برخی موارد، به اندازه کافی برای ایجاد سلول های حاوی کد تنها برای این به جای برخی از سلول های خالی، کافی است. هماهنگ کردن داده ها در ستون های جدول یک مشکل مشخص در هنگام ایجاد جداول، تنظیم پارامترهای همبستگی برای ردیف های فردی یا ستون ها است. برای تنظیم محتویات تمام سلول های خط فعلی، به اندازه کافی برای تنظیم پارامترهای مورد نیاز در کد کافی است . با این حال، اغلب لازم است برای اطمینان از هماهنگی مشابه برای تمام عناصر یک ستون، از آنجا که در اکثر موارد داده های همگن در ستون وجود دارد. در نسخه های قبلی HTML، پیشنهاد شده است از پارامتر Colspec (مشخصات ستون) که در برچسب تنظیم شده بود، پیشنهاد شد و . این ویژگی توسط مشخصات HTML ارائه نشده است، با این حال، هر دو Netscape و مایکروسافت اینترنت اکسپلورر پشتیبانی می شوند. فرم ضبط همانند برچسب است یعنی: BGColor \u003d مقدار که محتوای رنگ در فرمت RGB یا نام آن به عنوان یک مقدار تنظیم شده است. مثال: یا . جداول توطئه جداول جداول جداول ممکن است تقریبا هر تگ زبان و داده های مجاز را در بخش داشته باشند سند از جمله، در داخل سلول های جدول، جدول دیگری را می توان به طور کامل قرار داد. چنین جداول به نام توزیع شده است. قوانین ساخت و ساز آنها از ساخت جداول متفاوت نیستند و به شرح جداگانه نیاز ندارند. ما فقط توجه داریم که تمام مرورگرهایی که از جداول پشتیبانی نمی کنند، جداول پیچیده را با چندین سطح لانه نشان می دهد، بنابراین استفاده از آنها نیاز به احتیاط دارد. ما نمونه ای از یک جدول را ارائه می دهیم که از یک سطح لانه استفاده می کند. شهرهای منطقه لنینگراد H - جمعیت شهر (Th.، 1992) P - فاصله از سنت پترزبورگ (کیلومتر) شهرهای وابسته به سنت پترزبورگ شهر H. پ. وای 13.6 50 kallpino 144.6 26 کرونشتات 45.2 48 lomonosov 42.0 40 گداخته 25.4 30 Petrodvorets 83.8 29 پوچکین 95.1 24 Sestroretsk 34.9 35 همه شهرها وابسته هستند مدیریت سن پترزبورگ، gopodkay مستقیم شماره های تلویزیونی شهرهای ارسال منطقه ای شهر H. پ. boksitogorsk 21.6 align \u003d right\u003e 245 توپ 50.3 align \u003d right\u003e 122 بذر 32.9 24 وایبرگ 80.9 130 vysotsk 1.0 align \u003d right\u003e 159 گچ 80.9 46 Ivangorod. 11.9 align \u003d right\u003e 147 kamennogorsk 5.9 157 kingisepp 51.5 align \u003d right\u003e 138 کیریشی 53.8 align \u003d right\u003e 115 کیروفسک 23.8 55 میدان Loodynoye 27.3 align \u003d right\u003e 244 لیگ 41.8 139 (ادامه جدول) شهر H. پ. لیوبان 4.7 85 لادگا 11.2 align \u003d right\u003e 141 otradnoye 22. 9 align \u003d right\u003e 40 pikalevo 25.1 align \u003d right\u003e 246 ظاهر 23.1 285 پرایمورسک 6.7 137 prizersk 20.5 align \u003d right\u003e 145 svetogorsk 15.8 align \u003d right\u003e 201 شیل 42.6 align \u003d right\u003e 192 چرب 57.6 81 tikhvin 72.0 align \u003d right\u003e 200 tosno 33.8 53 لمب 12.5 64 شکل. 4.14.یک نمونه از جداول توطئه نتیجه نمایش این مثال در شکل نشان داده شده است. 4.14. در نگاه اول به نظر می رسد که در مثال هیچ جداول لانه وجود ندارد. در حقیقت، کل سند یک جدول است که چارچوبی ندارد و شامل یک هدر و تنها یک رشته حاوی پنج سلول نیست. سازمان این جدول تنها هدف را هدف قرار می دهد - موقعیت داده ها در صفحه. در داخل سلول اول، میز دیگری وجود دارد که دارای عنوان و متشکل از سه ستون است، پس از آن متن در وسط قرار دارد. سلول های سوم و پنجم نیز دارای جداول جداگانه هستند. سلول های دوم و چهارم خالی هستند، آنها هیچ اطلاعاتی ندارند و تنها پارامتر عرض را تعریف می کنند که عرض آن را تعیین می کند. انتصاب آنها این است که از یک ضعف بین اول و سوم، و همچنین سلول های سوم و پنجم که در آن جداول قرار داشته باشند، بپرسید. این یکی از گزینه های ممکن برای وظیفه چنین ضدیت است. یکی دیگر از گزینه ها این است که از پارامتر CoralSpacing استفاده کنید که فاصله بین سلول ها را تعیین می کند، اما این پارامتر به طور همزمان به صورت افقی و عمودی تنظیم می کند که در حال حاضر مورد نیاز نیست. علاوه بر این، یک سلول خالی با عرض پیش تعیین شده زمانی که منطقه مشاهده محدود شده است، بر خلاف فضای مشخص شده توسط پارامتر CoralSpacing (و همچنین CellPadding). سعی کنید روی این مثال برای کاهش عرض منطقه مشاهده در مرورگر یا، که منجر به این نتایج می شود، اندازه فونت را افزایش دهید که متن نمایش داده می شود. فاصله بین جداول به صفر کاهش می یابد، به این امکان که به طور همزمان تمام اطلاعات را تا زمانی که ممکن است به طور همزمان مشاهده شود، اما تغییر بیشتر منجر به اسپرل جدول نمی شود و امکان پیمایش افقی را فراهم می کند. با یک طرح مشابه، می توانید اطلاعاتی را که شامل نه تنها از جداول، بلکه تصاویر، قطعات متن و غیره سازماندهی می شود، سازماندهی کنید. ویژگی های جداول ساختمان این بخش برخی از امکانات خاص مرورگرهای فردی، و همچنین ظرافت های جداگانه ای از ساخت و نمایش جداول را مورد بحث قرار می دهد. نمایش سلول های خالی در جداول یکی از ویژگی های ارائه جداول توسط مرورگرهای مختلف، نمایش سلول های خالی است. با توجه به توصیف زبان، تمام مرورگرها باید خطوط را با سلول های خالی تکمیل کنند، اگر تعداد آنها به کوچکتر از بقیه خطوط تنظیم شود. علاوه بر این، هر جا در جدول می تواند سلول هایی باشد که حاوی داده ها نیستند. تفاوت بین سلول های خالی و سلول های حاوی داده های نامرئی وجود دارد. در سلول های خالی داخل یک جفت برچسب و و تعیین هماهنگی و عرض هر ستون جدول. به عنوان مثال، تنظیم Colspec \u003d "L40 R50 C80" برای سه ستون جدول جدول داده ها در سلول ها تعریف شده است: برای ستون اول - سمت چپ، برای دوم - راست و برای سومین مرکز، و همچنین عرض هر ستون همانطور که زبان HTML توسعه یافته است، از استفاده از این پارامتر اجتناب ناپذیر است، و در حال حاضر آن را در مشخصات زبان گنجانده نشده است و توسط اکثر مرورگرها پشتیبانی نمی شود. در نتیجه، برای حل این کار در Netscape Navigator، هیچ وجوه خاصی وجود ندارد و تنها گزینه با استفاده از هماهنگی پیش فرض یا وظیفه مقادیر مربوطه در هر سلول که لازم است، باقی می ماند. مایکروسافت اینترنت اکسپلورر برچسب های ویژه را فراهم می کند - و . این برچسب ها باید بلافاصله برای توضیحات قرار گیرد. قبل از اولین ظهور برچسب . پارامترهای برچسب و فاصله وجود دارد، که تعدادی از بلندگوهای مجاور را تعیین می کند که مقادیر پارامترها و هماهنگی اعمال می شود، که ترتیب افقی داده ها را در تمام سلول های ستون مربوطه (ستون ها) تعیین می کند. مقادیر مجاز پارامتر ALIGN، سمت راست و مرکز قرار دارد. برای پارامتر Span، مقدار پیش فرض یکی است. تگ علاوه بر این به شما اجازه می دهد پارامتر valign را تعیین کنید که ترتیب عمودی داده ها را در سلول ها تعیین می کند. مقادیر پارامتر valign میانه، بالا و پایین است. تفاوت بین برچسب ها و این همان چیزی است که یکی از آنها این است که علاوه بر تنظیم پارامترهای هماهنگی داده ها برای ستون ها، ترکیبی مشروط از چندین ستون را به گروه انجام می دهد. اثر چنین ارتباطی در هنگام استفاده از پارامتر قوانین، که در زیر شرح داده شده است، ظاهر می شود. به طور پیش فرض، تمام ستون ها به عنوان یک گروه در نظر گرفته می شوند. تگ باید فقط برای تعیین هماهنگی داده ها در ستون های جداگانه در گروه استفاده شود. بگذارید یک مثال بگذاریم اجازه دهید آن را برای ساخت یک جدول حاوی 6 ستون، و داده ها در سه اول از آنها باید به سمت راست، و سه بعدی - در وسط. برای حل این کار، این قطعه از کد HTML باید نوشته شود: (داده ها برای جدول) نتیجه نمایش این کد در شکل نشان داده شده است. 4.16. شکل. 4.16. جدول با پارامترهای مختلف برای هماهنگ کردن داده ها در گروه های سلول مثالی دیگر. اجازه دهید در جدول قبلی، دو ستون اول باید به سمت راست هماهنگ شوند، و سوم - در وسط، و هر سه بلندگو باید به گروه ترکیب شوند. سه ستون پس از آن نیز باید به یک گروه ترکیب شوند و هماهنگی مشابه گروه اول داشته باشند. برای حل این کار، این قطعه از کد HTML باید نوشته شود: (داده ها برای جدول) در این مثال پس از برچسب

از آن معنی وحدت در گروه قابل مشاهده است.

شورا

از زمان دامنه برچسب

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




شکل. 4.17. جدول با ستون های گروه بندی شده

شغل Frame Frame

چند پارامتر دیگر مشخصه تنها برای مایکروسافت اینترنت اکسپلورر به شما اجازه می دهد رنگ جداول را انتخاب کنید - BorderColor، BorderColorlight و Colordark مرزی. این پارامترها را می توان در برچسب ها تنظیم کرد

, . به عنوان ارزش این پارامترها، نام رنگ یا مقدار هگزادسیمال آن می تواند مورد استفاده قرار گیرد. پارامتر BorderColor رنگ تمام عناصر چارچوب جدول را تعریف می کند، در حالی که دو پارامتر دیگر رنگ های اجزای فردی را تنظیم می کنند و ارزش مرزی را از بین می برند. پارامتر BorderColorlight در رنگ مشخص شده چپ و لبه بالایی کل جدول و، بر این اساس، لبه های راست و پایین هر سلول. پارامتر دوم Bordercolordark رنگ های لبه های مخالف را تنظیم می کند. با توجه به ترکیبی از این پارامترها، جدول تا حدودی افزایش یافته است بالاتر از سطح صفحه یا عمیق. این همه به ترکیب رنگ انتخاب شده بستگی دارد.

توجه داشته باشید

مرورگر Netscape نسخه 4.X نیز از پارامتر BorderColor پشتیبانی می کند.

الگوی پس زمینه وظیفه برای جدول

مرورگر مایکروسافت اینترنت اکسپلورر (و همچنین مرورگر نسخه Netscape 4.x) به شما امکان می دهد از پارامتر پس زمینه استفاده کنید، که الگوی پس زمینه را برای جدول تعریف می کند، زیرا می توان آن را برای کل سند HTML انجام داد. این پارامتر را می توان در برچسب ها تنظیم کرد

,	و

, , w.

مرورگر مایکروسافت اینترنت اکسپلورر به شما امکان می دهد از تعدادی از تگ های جدید برای ساخت جداول و کنترل انعطاف پذیر از قاب نقاشی و خطوط مش استفاده کنید.

برچسب ها

, و ساختار توضیحات جدول به طور دقیق مشخص شده است، برجسته کردن جداول هدر جدول، محتوای اصلی جدول و رشته نهایی. این برچسب ها فقط می توانند در توضیح جداول داخل جفت برچسب ها ظاهر شوند

و	. برچسب ساختار جدول

و.

برچسب ها و استفاده شده برای توصیف پاورقی بالا و پایین جدول. این برچسب ها می توانند در جدول بیش از یک بار رخ دهند. برچسب نهایی را می توان برای آنها حذف کرد. با استفاده از داده های برچسب در هنگام ایجاد جداول بزرگ که فراتر از یک صفحه است، مناسب است.

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

هنگام استفاده از برچسب های جدید، امکان انعطاف پذیری بیشتر فریم ها و خطوط شبکه جدول را کنترل می کند.

کنترل قاب طراحی در اطراف جدول توسط پارامتر تگ فریم انجام می شود

، و خطوط جدول جدول پارامتر قوانین هستند. به عنوان مثال، ممکن است تنها خطوط عمودی بین بلندگوها را صرف کنید و به جای قاب در اطراف کل جدول، خطوط افقی را از بالا و پایین جدول قرار دهید.

پارامتر قاب می تواند مقادیر زیر را انجام دهد:

• جعبه یا مرز - قاب از هر چهار طرف کشیده شده است
• در بالا. - فقط از بالا
• در زیر. - فقط از پایین
• hsides - پایین و بالا را ترسیم می کند
• vsides - سمت چپ و راست کشیده شده است
• lhs - فقط در سمت چپ
• RHS - فقط در سمت راست
• خالی. - جدول بدون چارچوب خارجی

پارامتر قوانین، نقاشی خطوط داخلی شبکه جدول را کنترل می کند و می تواند مقادیر زیر را انجام دهد:

• همه. - تمام خطوط داخلی کشیده شده اند
• گروه ها. - فقط خطوط جداسازی خطوط کشیده شده
• ردیف - خطوط قرعه کشی، جداسازی رشته ها
• کول ها - خطوط جداسازی خطوط را تساوی می کند
• هیچ یک - خطوط داخلی کشیده نشده اند

مثال:

.

توجه داشته باشید

طراحی خطوط جدول جدول و فریم ها تنها در صورتی انجام می شود که یک پارامتر برچسب مرزی وجود داشته باشد

. در غیاب این پارامتر یا مقدار صفر آن از خط شبکه و قاب برای هر مقدار پارامترهای فریم و قوانین وجود ندارد.

ما نمونه ای از یک کد کامل HTML ایجاد یک جدول با استفاده از ویژگی های توصیف شده را ارائه می دهیم:

مثال از خطوط انعطاف پذیر
جدول مش

هدر ستون 1.	هدر ستون 2.	هدر ستون 3.
داده ها	داده ها	داده ها
داده ها	داده ها	داده ها
داده ها	داده ها	داده ها
داده ها	داده ها	داده ها
داده ها	داده ها	داده ها
داده ها	داده ها	داده ها
نتیجه	نتیجه	نتیجه




شکل. 4.18.خطوط طراحی انعطاف پذیر خطوط MeSH مرورگر مایکروسافت اینترنت اکسپلورر

در این مثال، نمایشگر مرورگر در شکل نشان داده شده است. 4.18، یکی از گزینه های ممکن برای کنترل خطوط شبکه و فریم های اطراف جدول. یک قاب از ضخامت 5 پیکسل در اطراف جدول (border \u003d s) تنها از سمت بالا و پایین (frame \u003d hsides) کشیده شده است. در داخل جدول، خطوط شبکه را جدا می کند (قوانین \u003d گروه ها). گروه های داده تعریف شده اند، در مرحله اول، حضور سه برچسب ، هر یک از آنها یک ستون جداگانه ای از جدول را اعلام می کند گروه ثانیا، برچسب ها , و<тгоот> همچنین داده های جدول را به گروه ها تقسیم کنید، که نقاشی خطوط افقی داخلی را تعیین می کند.

تنظیم شماره ستون جدول

مرورگر مایکروسافت اینترنت اکسپلورر (و همچنین مرورگر Netscape 4.x) اجازه می دهد تا در برچسب تنظیم شود

پارامتر COLS، که مقدار آن تعداد ستون ها را در جدول تعیین می کند. ضبط این پارامتر به شما امکان می دهد تا روش طرح بندی جدول را هنگام نمایش در مرورگر، سرعت بخشید، زیرا ممکن است تعداد ستون ها را تعیین کنید تا کد توضیحات جدول دانلود شود. در حال حاضر، گنجاندن این پارامتر بر پیشرفت بارگذاری سند تاثیر نمی گذارد.

مقطع عمودی جداول

آخرین پارامتر برچسب

Inspectorate فقط مایکروسافت اینترنت اکسپلورر، Valign است، که ترتیب عمودی جدول را نسبت به متن تعریف می کند. عمل آن شبیه پارامتر مشابه برای تصاویر است.

توجه داشته باشید

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

• برای برچسب

پارامتر ALIGN ممکن است مقادیر چپ یا راست را دریافت کند، و به معنی محل جدول، به سمت لبه سمت چپ یا راست فشار داده می شود؛

برای برچسب

,

پارامتر ALIGN ارزش گشتاور یا پایین را می گیرد و به معنی طرح بندی هدر جدول روی میز یا زیر آن است؛

برای tagov

و

پارامتر ALIGN مقادیر چپ، راست یا مرکز را می پذیرد و به معنی تطبیق محتویات سلول های مربوطه (یا سلول های) جدول افقی است. جایگزینی برای نمایندگی جدولی پشتیبانی از جداول تبدیل به یک ویژگی مشترک به طور گسترده ای از مرورگرهای وب شده است، به طوری که عملا هیچ دلیلی وجود ندارد که باید اجتناب شود. با این وجود، گزینه های احتمالی ارائه داده های جایگزین را در نظر می گیریم که می توانید به جای جداول استفاده کنید یا به آنها اضافه کنید. برخی از روش های دیگر که از مفهوم جداول استفاده نمی کنند: با استفاده از متن شبیه سازی شده. این روش به طور سنتی در نسخه های قبلی زبان HTML مورد استفاده قرار گرفته است، زمانی که پشتیبانی از جدول هنوز وجود نداشته است. استفاده از آن و تا کنون ارتباطات را از دست نداد، به عنوان چنین متون به درستی توسط هر مرورگره، از جمله متن صرفا نمایش داده می شود. با استفاده از یک تصویر حاوی یک جدول. جدول را می توان توسط هر ویرایشگر متن ایجاد کرد یا حتی توسط مرورگر وب نمایش داده می شود و سپس به عنوان یک تصویر در یکی از فرمت های گرافیکی ذخیره می شود. این بهترین گزینه نیست، زیرا تمام انعطاف پذیری تنظیمات پویا از صفحه نمایش از دست رفته است. علاوه بر این، لازم است یک فایل اضافی را با یک تصویر ذخیره کنید، اندازه آن، علاوه بر این، به عنوان یک قاعده، بسیار بزرگتر از اندازه متن است که جدول HTML را توصیف می کند. مساحت احتمالی برنامه - جداول ابعاد دقیق تعریف شده که وابستگی صفحه نمایش آن از هر عامل خارجی (فونت، حالت های عملیات مرورگر و غیره) نامعتبر است. استفاده از لیست به جای جداول. برای ساده ترین موارد، به جای سازماندهی جداول، کاملا امکان پذیر است با یکی از لیست های موجود در زبان HTML. آماده سازی جدول برای تهیه جداول HTML، هر یک از ویراستاران می توانند مورد استفاده قرار گیرند، اکثر آنها به معنای برای ایجاد جداول بصری هستند. بگذارید نمونه ای از آماده سازی جدول را در ویرایشگر حرفه ای Hotdog ارائه دهیم. برای ایجاد یک جدول، به اندازه کافی برای انتخاب جداول از منوی Insert، پس از آن جعبه محاوره ای که در شکل نشان داده شده است، صادر می شود. 4.19. ایجاد یک جدول شامل پر کردن فیلدهای مربوطه در پنجره می شود. پس از تعیین تعداد ردیف ها و ستون ها در جدول، می توانید به طور مستقیم به پر کردن سلول های جدول فردی بروید، که در همان کادر محاوره ای نشان داده می شود. جعبه محاوره پیش نمایش، با فشار دادن که به شما اجازه می دهد تا جدول نتیجه را با استفاده از یک مرورگر داخلی (شکل 4.20) مشاهده کنید. شکل. 4.19. کادر محاوره ای برای ایجاد جداول شکل. 4.20. جدول نشان داده شده توسط مرورگر داخلی پس از آماده سازی داده ها برای جدول تکمیل شده، روی OK کلیک کنید. سپس کد توصیفی جدول تولید شده به سند HTML قابل ویرایش وارد می شود. به عنوان مثال، نشان داده شده در شکل. 4.19، کد زیر تولید خواهد شد: (بخشی از کد حذف شده) جدول 3allo CTLBE 1 ستون 2 CTOS 3 ستون 4 1 2 3 4 به طور مشابه، این وظیفه هنگام استفاده از کامپوننت آهنگساز Netscape از Communicator Netscape حل شده است. در شکل 4.21 یک کادر محاوره ای را نشان می دهد که لازم است فیلدهای مورد نیاز را پر کنید. برای وارد کردن پارامترهای تگ اضافی دکمه HTML اضافی فراهم می کند. پس از پر کردن زمینه کادر محاوره، دکمه اعمال را فشار دهید و سپس توانایی پر کردن سلول های جدول را فشار دهید (شکل 4.22). شکل. 4.21. کادر محاوره ای برای تنظیم تنظیمات جدول آهنگساز Netscape شکل. 4.22. موقعیت اولیه مکان نما ورودی در جدول خالی یک جدول بدن وجود دارد. بدن شامل ردیف ها و ستون ها می شود. جدول در خط پر شده است. هر برچسب یک رشته جدید ایجاد می کند. بعد در توطئه ستون ها ایجاد می شوند شما می توانید بسیاری از ستون ها را ایجاد کنید. در این مورد، شما باید تعداد ستون ها را در هر ردیف نظارت کنید. به عنوان مثال، اگر 5 ستون در خط اول وجود داشته باشد، سپس در خطوط زیر باید 5 ستون وجود داشته باشد. در غیر این صورت، میزبان میز است. ممکن است سلولها را ترکیب کنید. نحوه ساخت یک جدول در HTML بگذارید یک مثال، کد HTML را ارائه دهیم: جدول نمونه ستون 1 ستون 2 توجه به سلول . ما از ویژگی خاص Colspan برای ترکیب سلول های افقی استفاده می کنیم. مقدار عددی آن نشان می دهد تعداد ستون های متحد توسط. همچنین یک آنالوگ از این ویژگی وجود دارد: برچسب (جدول هدر)، جایی که شما همچنین باید Colspan را ثبت کنید. نتیجه یکسان خواهد بود. اما اغلب از TD معمولی استفاده می شود. در حال حاضر جزئیات تمام ویژگی های برچسب را در نظر بگیرید . ویژگی ها و ویژگی های برچسب به تگ باز شما می توانید ویژگی های مختلف را تجویز کنید. 1. align \u003d "پارامتر" اموال - تنظیم جدول جدول. می تواند مقادیر زیر را انجام دهد: در مثال جدا شده، ما جدول را در مرکز ALIGN \u003d "مرکز" قرار دادیم. این ویژگی را می توان نه تنها به جدول، بلکه همچنین به جداول فردی جدول اعمال کرد. . بنابراین، در سلول های مختلف، هماهنگی متفاوت خواهد بود. مثلا , , , یا cOLS - خط بین ستون ها نمایش داده می شود هیچ کدام - همه مرزها پنهان هستند ردیف ها - مرز بین ردیف جدول ایجاد شده از طریق برچسب کشیده شده است 12. Width \u003d "شماره" اموال - عرض جدول را تنظیم می کند: یا در پیکسل یا درصد. 13. اموال کلاس \u003d "نام کلاس" - شما می توانید نام کلاس را مشخص کنید که جدول متعلق به آن است. 14. Style Property \u003d "سبک" - سبک ها را می توان به صورت جداگانه برای هر جدول تنظیم کرد. اکنون وقت آن است که خود را در جدول غوطه ور کنید و ویژگی های سلول های جدول را در نظر بگیرید. این ویژگی ها باید در برچسب کشف بنویسند و پارامترهای مشابه در دسترس هستند سلسله مراتب به همه اعمال خواهد شد یا رشته ها ... ... ... 2. پس زمینه ویژگی \u003d "URL" - طراحی پس زمینه را تنظیم می کند. به جای URL، آدرس تصویر پس زمینه باید نوشته شود. مثال جدول نمونه ستون 1 ستون 2 تبدیل به صفحه بعدی: در مثال مورد بررسی، تصویر پسزمینه ما در پوشه IMG واقع شده است (که در همان دایرکتوری به عنوان صفحه HTML قرار دارد)، و تصویر fon.gif نامیده می شود. لطفا توجه داشته باشید که در برچسب ما style \u003d "رنگ: سفید؛" . از آنجا که پس زمینه تقریبا سیاه است، به طوری که متن با پس زمینه ادغام نمی شود، ما متن سفید را ساخته ایم. 3. املاک bgcolor \u003d "رنگ" - پس زمینه رنگ جدول را تنظیم می کند. به عنوان یک رنگ، شما می توانید هر یک از کل پالت را انتخاب کنید (نگاه کنید به کدها و عناوین رنگ HTML) 4. Border \u003d "شماره" اموال - ضخامت قاب جدول را تنظیم می کند. در نمونه های قبلی، ما به مرز \u003d "1" اشاره کردیم، که به معنی ضخامت فریم - 1 پیکسل است. 5. BorderColor \u003d "رنگ" املاک - رنگ قاب را تنظیم می کند. اگر مرزها \u003d "0" باشد، چارچوب نه و رنگ فریم منطقی نخواهد بود. 6. Cellpadding Property \u003d "شماره" - دندانه دار از قاب به محتویات سلول در پیکسل. 7. Cellspacing Property \u003d "شماره" - فاصله بین سلول های پیکسل. 8. املاک Cols \u003d "شماره" تعداد ستون ها است. اگر شما آن را مشخص نکنید، مرورگر خود تعداد ستون ها را تعیین می کند. تنها تفاوت این است که مشخصات این پارامتر احتمالا سرعت دانلود جدول را افزایش می دهد. 9. Property Frame \u003d "پارامتر" - نحوه نمایش مرزها در اطراف جدول. می تواند مقادیر زیر را انجام دهد: void - مرزها را نپوشانید مرز مرزی در اطراف میز بالا - مرز در لبه بالا جدول در زیر - مرز از پایین جدول hsides - اضافه کردن تنها مرزهای افقی (بالا و پایین جدول) vsides - قرعه کشی تنها مرزهای عمودی (چپ و راست از جدول) rHS - مرز فقط در سمت راست جدول lHS - مرز فقط در سمت چپ میز 10. ارتفاع \u003d "شماره" اموال - ارتفاع جدول را تنظیم می کند: یا در پیکسل یا در درصد. 11. اموال قوانین \u003d "پارامتر" - از کجا برای نمایش مرز بین سلول ها. می تواند مقادیر زیر را انجام دهد: همه خط ها در اطراف هر جدول سلولی ترسیم می شوند گروه ها - خط بین گروه هایی که توسط برچسب ها تشکیل شده است نمایش داده می شود. . ویژگی ها و خواص 1. اموال align \u003d "پارامتر" - ترتیب یک سلول جداگانه جدول جداگانه را تنظیم می کند. می تواند مقادیر زیر را انجام دهد: چپ - سطح بالا به لبه سمت چپ مرکز مرکز تراز راست - هماهنگی در لبه سمت راست 2. پس زمینه \u003d "URL" املاک - مجموعه تصویر پس زمینه سلول. به جای URL، آدرس تصویر پس زمینه باید نوشته شود. 3. bgcolor \u003d "رنگ" اموال - رنگ پس زمینه سلولی را تنظیم می کند. 4. bordercolor \u003d "رنگ" اموال - رنگ قاب سلول را تنظیم می کند. 5. Char \u003d "Letter" Property - نامه ای را تعیین می کند که از آن شما باید هماهنگی را انجام دهید. مقدار align attribute باید به صورت char نصب شود. 6. اموال Colspan \u003d "شماره" - تعداد سلول های افقی ترکیبی را تعیین می کند. 7. ارتفاع \u003d "شماره" اموال - ارتفاع جدول را تعیین می کند: یا در پیکسل یا درصد٪. 8. Width \u003d "شماره" اموال - عرض جدول را تنظیم می کند: یا در پیکسل یا درصد٪. 9. Rowspan \u003d "شماره" اموال - تعداد سلول های عمودی یونایتد را تنظیم می کند. 10. Property Valign \u003d "پارامتر" - محتویات سلول را به صورت عمودی تنظیم کنید. بالا - محتویات سلول را در لبه بالایی خط قرار دهید وسط هم ترازی در وسط پایین - تراز کردن در لبه پایین پایه - تطبیق پایه یادداشت 1. برای برچسب . پارامترهای یک برچسب در داخل آن چگونه می توان مرزهای سلول ها را در جدول قرار داد در مورد استفاده از مرزها (مرز سلول ها) و صفر، بین سلول ها، آنها هنوز چسب و یک مرز دوگانه را به نمایش می گذارند. برای اجتناب از آن، شما نیاز به ثبت نام در سبک جدول Border-Collapse: COLLAPSE: ... خواننده عزیز، در حال حاضر شما در مورد برچسب جدول HTML بیشتر آموخته اید. حالا من به شما توصیه می کنم که به درس بعدی بروید. با استفاده از ویژگی های Colspan، Rowspan شما می توانید چندین سلول ستون مجاور یا رشته ها را به یک سلول بزرگ ترکیب کنید. ویژگی Colspan Tev و . متن بین برچسب ها قرار گرفته است ، این سبک را به ارث نمی برد، از زمان برچسب نه برچسب . تراز متن افقی در یک ستون جدول خاص را می توان با مشخص کردن سبک تغییر داد متن ترانه برای pseudoclassa tD: Nth-Child (N) جایی که n عدد ستون است. با این حال، این روش کار نخواهد کرد اگر یک ویژگی در میان جداول جدول وجود داشته باشد کلپان. مثال , به شما اجازه می دهد سلول های چند ستون را در همان خط ادغام کنید. Rowspan ویژگی - سلول ها از چندین خط در یک ستون. شماره مشخص شده در این ویژگی ها نشان دهنده تعداد سلول هایی است که با هم ترکیب می شوند. زیرا هنگام انجام عملیات ادغام، بسیار آسان است که گیج شود، من به شدت توصیه می کنم طرح اولیه جدول روی کاغذ را انجام دهم. مثال: و ساده ترین راه برای درک چگونگی استفاده از گروه بندی ردیف ها و ستون ها در مثال جدول سودوکو. برچسب Col پارامترهای جداگانه را برای هر ستون تنظیم می کند. مهم نیست که چگونه در کد منبع بنویسید: یا مثال کد HTML: 1111 22222 33333 44444 55555 66666 77777 88888 99999 نمایش در مرورگر: 1111 22222 33333 44444 55555 66666 77777 88888 99999 بهبود ظاهر جدول صفحه HTML ویژگی CoralSpacing باعث می شود که اندازه نوار فضای خالی را که جدول را از بیرون می گیرد تنظیم کنید. به طور پیش فرض، مرورگر سلول های جدول گروه را در 2 پیکسل به اشتراک می گذارد. ویژگی CellPadding اندازه باند های فضایی خالص داخل سلول را تعیین می کند و محتوای آن را از مرزهای خارجی جدا می کند. به طور پیش فرض، این مقدار 1 پیکسل است. برای ایجاد تصاویر گرافیکی قرار داده شده در سلول های میز همسایه، آن را به نظر می رسد یک کل کامل، شما نیاز به تنظیم ویژگی های CellSpacing، CellPadding صفر مقادیر. نمایش جدول صفحه HTML صفحه اگر ارزش ویژگی ویژگی مرزی این متفاوت از صفر است، مرورگر یک جدول را به فریم می رساند و ردیف های همسایه و ستون های جدول را متمایز می کند. با استفاده از ویژگی های فریم، قوانین می توانند مشخص کنند که کدام بخش از طرح های جدول باید نشان داده شود. ویژگی قاب برای تعیین قطعات از خطوط خارجی جدول استفاده می شود. ویژگی های قوانین - مجموعه ای از خطوط جداسازی داخلی را نشان می دهد. در زیر مقادیر مجاز این ویژگی ها است. مقدار فریم ارزش VOID تمام خطوط بالا بالا خط بالا جدول زیر خط زیر خط خط زیر خط خط پایین از جدول LHS خط خط خط چپ بالا و زیر جدول vsides خطوط در سمت چپ و راست از مرز جدول تمام خطوط وجود دارد (به طور پیش فرض) قوانین هیچ کدام از خطوط وجود دارد خطوط COLS بین ستون های خط ردیف بین گروه های گروهی بین گروه های ستون ها و ردیف ها تمام خطوط موجود وجود دارد (به طور پیش فرض) مثال: کد HTML: 111 111 111 111 111 111 نمایش در مرورگر: 111 111 111 111 111 111 انتقال کلمه در سلول های صفحه HTML به طور پیش فرض، مرورگر انتقال خودکار کلمات متن را در داخل سلول جدول می گیرد. ویژگی NOWRAP به صورت اجباری تابع انتقال کلمه را در جدول جدا می کند و متن را به یک خط نمایش می دهد. بنابراین، این ویژگی توصیه می شود که با توجه به سلولهای جدول حاوی متن کوتاه استفاده شود، زیرا در غیر این صورت، فراتر از پنجره مرورگر خواهد بود. لازم به ذکر است که این ویژگی بر روی متن سلول های فرمت شده توسط برچسب ها تاثیر نمی گذارد , . جداول صفحه HTML توزیع شده پیوستن جداول یک به دیگری یک کاربرد بسیار رایج از ظاهر صفحه وب است. اول از همه، لازم است یک جدول اصلی ایجاد شود، و سپس در سلول های خود برای قرار دادن شرکت های تابعه. تعریف جدول، نباید فراموش نکنید که در توضیحات خود، تمام تگ های بسته بندی حاوی نماد اسلش را شامل شود، زیرا جست و خیز تنها یک توصیفگر، جدول را به طور چشمگیری تحریف می کند. نباید، همچنین، وابستگی به سوء استفاده، به دلیل در این مورد، بار صفحه مرورگر به طور قابل توجهی کاهش می یابد. قالب بندی های سرمایه گذاری شده با توجه به قوانین عمومی انجام می شود، که در واقع، صفحه را جذاب می کند. مثال: . تگ بسته بندی واجب است توجه: بدون استفاده از تمام این برچسب ها، جدول امکان پذیر نیست. حالا سعی کنید از تئوری استفاده کنید و یک جدول را در عمل ایجاد کنید. وظیفه: یک جدول را از یک ردیف ایجاد کنید، جایی که سه ستون وجود داشته باشد. کد HTML: 111 111 01 01 01 01 111 111 111 نمایش در مرورگر: 111 111 01 01 01 01 111 111 111 09.11.2015 سلام همه! ما همچنان به بررسی پایه های HTML ادامه می دهیم. در این درس، من به مثالها می گویم، نحوه ساخت یک جدول در HTML. و همچنین در نظر بگیرید که چگونه می توانید رنگ سلول های جدول را تنظیم کنید، چگونه می توان جدول را به مرکز، یاد بگیرید چگونه به مرز جدول، و غیره جداول HTML اغلب در HTML مورد استفاده قرار می گیرند تا برخی از اطلاعات را شمارش کنند. قبلا، جداول برای ایجاد چارچوب صفحات وب مورد استفاده قرار گرفت: ... اما این در حال حاضر در گذشته است، به عنوان امروز راه های کارآمد تر برای ایجاد چارچوب برای سایت با. من اغلب از یک جدول در وبلاگ من یا در سایت استفاده می کنم، به عنوان مثال، به عنوان مثال، من فکر می کنم شما متوجه شدید چه چیزی باید یاد بگیرد که یک جدول ایجاد شود. چه برچسب های اصلی شامل یک جدول است؟ ○ برچسب جدول این کانتینر اصلی برای ایجاد یک میز است، که در آن عناصر جدول دیگر شامل ستون ها و ردیف ها هستند. تگ بسته اجباری است ○ برچسب T.R. داخل ظرف …… ردیف های قرار داده شده: ستون ها با استفاده از برچسب ایجاد می شوند سری -1 / ستون 1 ستون 2 ستون 3. وظیفه: یک جدول از سه ردیف و سه ستون ایجاد کنید. سری -1 / ستون 1 ستون 2 ستون 3. سری -2 / ستون 1 ستون 2 ستون 3. ردیف -3 / ستون 1 ستون 2 ستون 3. تا آن لحظه شما همه چیز روشن است؟ چه کسی نمی فهمید، دست خود را بالا ببرید! بله، همه چیز را درک کرد، سپس ما بیشتر می رویم. در حال حاضر ویژگی های جدول را در نظر بگیرید. * ویژگی های ○ مرز جدول در HTML جدول قابل مشاهده برای برچسب کاربردی صفت "مرز» . اگر مقدار ویژگی « مرز» "0"، مرزها قابل مشاهده نیستند، اگر نه ثبت نام به برچسب صفت مرز ، مرز در جدول نیز قابل مشاهده نخواهد بود. سری -1 / ستون 1 ستون 2 ستون 3. نتیجه: سعی کنید مقدار را در ویژگی تغییر دهید مرز در "10" . ○ چگونه سلول ها را در جدول ترکیب کنیم برای ادغام سلول ها در جدول استفاده از ویژگی ها "Colspan" و "Rowspan" به برچسب < tD> . colspan - ترکیب سلول ها به صورت افقی؛ rowspan - انجمن سلول های عمودی. در مقادیر نشان می دهد که چقدر سلول ها باید ادغام شوند. ردیف 1 ستون 1 سری 2 مرحله 1 سری 2 مرحله 2 نتیجه: ردیف 1 ستون 1 ردیف 1 مرحله 2 سری 2 مرحله 1 نتیجه: مثال پیچیده تر: سری -1 / ستون 1 ستون 2 ستون 3. سری -2 / ستون 1 ستون 2 ستون 3. ستون 4 نتیجه: ○ چگونه می توان فاصله بین جداول جدول را افزایش داد برای افزایش فاصله بین متن و مرز سلول، یک ویژگی را تجویز کنید "Cellpadding" نشان گذاری در مقادیر ویژگی "cellpadding" نشان می دهد فاصله از دست دادن ردیف 1 ستون 1 ستون 2 نتیجه: برای زوم کردن فاصله بین سلول ها در جدول، از ویژگی استفاده کنید "corpacing" نشان گذاری در مقادیر ویژگی "corpacing" فاصله بین سلول ها را مشخص کنید ردیف 1 ستون 1 ستون 2 نتیجه: ○ نحوه ایجاد پس زمینه جدول HTML برای ایجاد پس زمینه جدول HTML به برچسب استفاده کنید و چنین ویژگی هایی: BGColor - رنگ پس زمینه کل جدول یا هر سلول به طور جداگانه. رنگ توسط کد یا کلمه تنظیم شده است. پس زمینه -Phone در جدول با یک الگوی پر شده است. سری -1 / ستون 1 ستون 2 ستون 3. سری -2 / ستون 1 ستون 2 ستون 3. ستون 4 نتیجه: ○ نحوه قرار دادن یک عکس در جدول HTML برای قرار دادن یک عکس در جدول HTML، بین برچسب برچسب را وارد کنید . ردیف 1 سلول 1 سلول 2 نتیجه: مقادیر در پیکسل ها (PX) یا درصد (٪) تنظیم می شوند ○ محتوای جدول HTML را هماهنگ کنید برای تراز کردن محتویات در جدول HTML، از برچسب استفاده کنید صفت "ALIGN" و "VALIGN" : هماهنگ کردن - تراز محتوا افقی در جدول. ارزش های: ترک کرد. - محتوا را به سمت چپ فشار دهید (به طور پیش فرض); مرکز – نصب در مرکز؛ درست - محتوای را به قسمت راست فشار دهید valign. - تراز عمودی محتوا در جدول. ارزش های: بالا. – محتوای را به بالا فشار دهید پایین – محتوای را به پایین فشار دهید وسط – محتوای را در وسط تنظیم کنید متن سلول به طور پیش فرض محتوا به صورت افقی در امتداد لبه سمت راست، به صورت عمودی به پایین فشار می دهد محتویات به صورت افقی در امتداد لبه سمت چپ، به صورت عمودی - به بالا فشار دهید محتوا به صورت افقی در مرکز، به طور عمودی فشار در وسط نتیجه: ○ چگونه جدول HTML را در مرکز قرار دهیم برای هماهنگی جدول در مرکز، باید برچسب جدول را بردارید : کد جدول سری -1 / ستون 1 ستون 2 ستون 3. برچسب های اضافی و اصلی به جدول جدول برای وب سایت نام 1 نام 2 1 2 نتیجه: به پایان رسید با جداول. اکنون می توانید یک جدول از هر گونه پیچیدگی ایجاد کنید. این درس را امن کنید سعی کنید هر جدول خود را ایجاد کنید. در انتظار شما در درس بعدی. مشترک شدن برای به روز رسانی وبلاگ من پست قبلی پست بعدی جدول با فریم نام نام خانوادگی لاریسا isaeva دیمیتری kolesnikov نتیجه: جدول بدون فریم جدول با فریم ویژگی ها tagov و برای ادغام سلول ها مثال چرخیدن وزن اندازه مردانه 1.2 - 2.5 کیلوگرم تا 70 سانتی متر زنان 0.7 - 1.0 کیلوگرم تا 40 سانتیمتر نتیجه: چرخیدن وزن اندازه مردانه 1.2 - 2.5 کیلوگرم تا 70 سانتی متر زنان 0.7 - 1.0 کیلوگرم تا 40 سانتیمتر با توجه به استاندارد HTML5، تمام ویژگی های جدول قبلا استفاده شده، مانند مرز, cellspacing., cellpadding و همکاران دیگر پشتیبانی نمی شوند و استفاده از Validator اشتباهات را در کد بررسی می کند. برای ساخت جداول، شما باید از سبک های CSS استفاده کنید، که می توانید تمام ویژگی های جدول قدیمی را جایگزین کنید. به عنوان مثال، به جای یک ویژگی cellspacing. برای تغییر فاصله بین سلول های جدول، اموال استفاده می شود. فاصله مرزی، و محتویات را در سلول های جدول تنظیم کنید - خواص متن ترانه و عمودی آلینگ. سبک CSS برای جداول برچسب ها گروه بندی رشته ها جدول HTML برای ایجاد جداول پیچیده تر، می توانید از برچسب ها استفاده کنید: مثال مصرف آبجو نام و نام خانوادگی. لیتروف جمع 250 ایوانوف ایوان ایوانویچ 133 پتروف پتروویچ 117 نتیجه: برچسب های گروه بندی ستون های HTML ویژگی برچسب رنگ زرد قرمز نتیجه: سعی نکنید سبک را تنظیم کنید متن ترانه برای tagov ... نه یک نسل نه برچسب نام قیمت، مالش.) در هر دقیقه پرداخت سولاریوم (از 4 دقیقه) 15 50 دقیقه از سولاریوم (14 روبل / دقیقه، 1 ماه) 700 100 دقیقه Solarium (13 روبل / دقیقه، 2 ماه) 1300 200 دقیقه از سولاریوم (12 روبل / دقیقه، 3 ماه) 2400 نتیجه: با این حال، این روش کار نخواهد کرد اگر یک ویژگی در میان جداول جدول وجود داشته باشد کلپان. پاسخ به سوال شما پیدا نشد؟ به اینجا نگاه کن ویژگی های جهانی ویژگی های HTML5 را تشکیل می دهند مقدمه ای بر JSON چه فایل JSON TXT عبارات منظم (REGEXP Object) فرم بررسی عبارات منظم جاوا اسکریپت