Як розтягнути таблицю.

Необхідність розтягнути таблицю на весь простір вікна браузера виникає, наприклад, коли дизайн сторінки поміщений всередину таблиці. Вирішення цієї задачі не вимагає твори складного коду, але передбачає врахування деяких особливостей розмітки веб-сторінок.
Вам знадобиться
  • Початкові знання мови HTML
Інструкція
1
Спочатку вам треба уточнити сенс майбутньої операції. В HTML-коді сторінки таблиці представляють собою набір вкладених один в одного парних тегів (по одному відкривається і закривається). Теги осередків ( і ) вкладені в теги рядків ( і ), а ті в свою чергу - в теги таблиці ( і
). У відкриває теге таблиці можна задавати її ширину і висоту як в абсолютних одиницях (пікселах), так і відносних (відсотках). При відносних розмірах за 100% приймається ширина і висота батьківського елемента таблиці. Якщо помістити таблицю безпосередньо в тіло сторінки (а не в шар, форму, іншу таблицю , і т.д.), то розмірами її батьківського елемента і будуть ширина і висота сторінки . Значить, щоб розтягнути таблицю на весь вільний простір, треба вказати їй 100% розміри по горизонталі і вертикалі.
2
Тепер можна зайнятися практичною реалізацією цього в HTML-коді. Ширина і висота таблиці задається атрибутами width і height. Значить код таблиці із зазначенням 100% розмірів по всіх напрямах і, наприклад, з двома осередками в одному рядку, може виглядати так:
ліва комірка таблиці правая осередок таблиці
3
Вказівки 100% ширини і висоти буде достатньо, щоб розтягнути таблицю , якщо ви правильно виберіть HTML-стандарт, за яким браузер має читати код сторінки. Відповідний тег розміщується в самій першому рядку документа. Вам потрібен тег такого змісту:
4
І ще один момент слід врахувати в вашому коді: за замовчуванням сторінка має відступи від країв вікна розміром в декілька піксел, тому таблиця, навіть заповнивши всю сторінку, все ж не розтягнеться на все вікно. Щоб знищити ці непотрібні поля, можна в відкриваючому тезі тіла сторінки () вказати нульові відступи у відповідних атрибутах:
5
В зборі весь код сторінки з розтягнутою на всю ширину і висоту екрану таблицею виглядатиме так:
Растянутая таблиця
ліва комірка таблиці правая осередок таблиці