Пример таблицы html: Как создать таблицу в HTML5 и указать её параметры через стили?

Leave a Comment / Html / By /

Содержание

Как создать таблицу в HTML5 и указать её параметры через стили?

Тема:Таблицы

Internet ExplorerChromeOperaSafariFirefoxAndroidiOS
8.0+1.0+4.0+1.0+1.0+1.0+1.0+

Задача

Создать таблицу и указать её параметры (поля и расстояние между ячейками) через стили.

Решение

Таблица состоит из строк и столбцов ячеек, которые могут содержать текст и рисунки. Для добавления таблицы на веб-страницу используется тег <table>. Этот элемент служит контейнером для элементов, определяющих содержимое таблицы. Любая таблица состоит из строк и ячеек, которые задаются соответственно с помощью тегов <tr> и <td>. Таблица должна содержать хотя бы одну ячейку (пример 1). Допускается вместо тега <td> использовать тег <th>. Текст в ячейке, оформленной с помощью тега <th>, отображается браузером шрифтом жирного начертания и выравнивается по центру ячейки. В остальном, разницы между ячейками, созданными через теги <td> и <th> нет.

Пример 1. Создание таблицы

HTML5IECrOpSaFx

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>Тег table</title>
 </head>
 <body>
  <table border="1">
   <tr>
    <th>Ячейка 1</th>
    <th>Ячейка 2</th>
   </tr>
   <tr>
    <td>Ячейка 3</td>
    <td>Ячейка 4</td>
  </tr>
 </table>
 </body>
</html>

Порядок расположения ячеек и их вид показан на рис. 1.

Рис. 1. Результат создания таблицы с четырьмя ячейками

Атрибут border тега <table> допустимо добавлять только с пустым значением (<table border>) или равным 1. Все остальные значения не проходят валидацию.

Для управления полями внутри ячеек используется стилевое свойство padding, которое добавляется к селектору td. Расстояние между ячейками меняется свойством border-spacing (пример 2) добавляемым к селектору table, браузер IE понимает его только с версии 8. 0.

Пример 2. Поля внутри ячеек

HTML5CSS 2.1IECrOpSaFx

<!DOCTYPE html>
<html>
 <head>
  <meta charset="utf-8">
  <title>Тег table</title>
  <style>
   table {
    width: 100%; /* Ширина таблицы */
    background: white; /* Цвет фона таблицы */
    color: white; /* Цвет текста */
    border-spacing: 1px; /* Расстояние между ячейками */
   }
   td, th {
    background: maroon; /* Цвет фона ячеек */
    padding: 5px; /* Поля вокруг текста */
   }
  </style>
 </head> 
 <body>
  <table>
   <tr><th>Заголовок 1</th><th>Заголовок 2</th></tr>
   <tr><td>Ячейка 3</td><td>Ячейка 4</td></tr>
  </table>
 </body>
</html>

Таблица с полями и расстоянием между ячейками показана на рис. 2. Аналогичного результата можно добиться и с помощью рамки белого цвета вокруг ячеек.

Рис. 2. Поля в ячейках таблицы

таблицыHTML5

Работа с таблицами на HTML

Сейчас мы с вами научимся делать таблицы на HTML.

Я думаю, вы представляете, что такое таблица в обычной жизни — это набор строк и столбцов, на пересечении которых находятся ячейки.

В HTML таблицы создаются по похожему принципу. Там тоже есть столбцы и строки с ячейками, однако HTML код таблиц при первом взгляде может показаться непривычным: таблицы создаются по рядам — сначала первый ряд, потом второй и так далее.

Код таблицы имеет жесткую структуру: главным является тег table, внутри которого должны лежать теги tr, которые создают ряды таблицы, а внутри них — теги td, которые создают ячейки. Тег table может иметь атрибут border, который задает границу таблице и ее ячейкам.

Давайте для примера сделаем таблицу с тремя рядами и тремя ячейками в каждом ряду:

<table border="1"> <!--Это будет первый ряд таблицы:--> <tr> <td>ячейка 1</td> <td>ячейка 2</td> <td>ячейка 3</td> </tr> <!--Это будет второй ряд таблицы:--> <tr> <td>ячейка 4</td> <td>ячейка 5</td> <td>ячейка 6</td> </tr> <!--Это будет третий ряд таблицы:--> <tr> <td>ячейка 7</td> <td>ячейка 8</td> <td>ячейка 9</td> </tr> </table>

:

Ширина и высота таблицы

С помощью атрибутов width и height можно задать ширину и высоту таблице. Зададим, например, нашей таблице ширину в 300 пикселей, а высоту — в 200:

<table border="1"> <tr> <td>ячейка 1</td> <td>ячейка 2</td> <td>ячейка 3</td> </tr> <tr> <td>ячейка 4</td> <td>ячейка 5</td> <td>ячейка 6</td> </tr> <tr> <td>ячейка 7</td> <td>ячейка 8</td> <td>ячейка 9</td> </tr> </table>

:

Добавьте вашей таблице ширину 400 пикселей и высоту 300.

Ячейки-заголовки

Кроме тегов td существуют также теги th, которые также создают ячейки. Но это уже будут не обычные ячейки, а ячейки-заголовки, которые указывают, что находится в данном столбце (или строке) таблицы. По умолчанию текст в таких ячейках th будет жирный и расположен по центру.

Давайте посмотрим на примере. Пусть у нас есть вот такая таблица с работниками:

<table border="1"> <tr> <td>Иван</td> <td>Иванов</td> <td>200$</td> </tr> <tr> <td>Николай</td> <td>Петров</td> <td>300$</td> </tr> <tr> <td>Владимир</td> <td>Сидоров</td> <td>400$</td> </tr> </table>

:

Как вы видите, в первом столбце хранится имя работника, во втором столбце — фамилия, а в третьем — зарплата. Давайте сделаем еще один ряд в начале таблице, в котором разместим заголовки колонок в тегах th:

<table border="1"> <tr> <th>Имя</th> <th>Фамилия</th> <th>Зарплата</th> </tr> <tr> <td>Иван</td> <td>Иванов</td> <td>200$</td> </tr> <tr> <td>Николай</td> <td>Петров</td> <td>300$</td> </tr> <tr> <td>Владимир</td> <td>Сидоров</td> <td>400$</td> </tr> </table>

:

Границы таблицы HTML

❮ Назад Далее ❯

HTML-таблицы могут иметь границы разных стилей и форм.

Как добавить границу

Когда вы добавляете границу к таблице, вы также добавляете границы вокруг каждой ячейки таблицы:

Чтобы добавить границу, используйте свойство CSS border на таблица , -й и тд элементы:

Пример

таблица, тд, тд {
  граница: 1 пиксель сплошной черный;

}

Попробуйте сами »

Границы свернутой таблицы

Чтобы избежать двойных границ, как в примере выше, установите CSS border-collapse свойство крах .

Это приведет к сворачиванию границ в единую границу:

Пример

table, th, td {
  border: 1px сплошной черный;
граница коллапса: коллапс;
}

Попробуйте сами »

Границы таблицы стилей

Если вы установите цвет фона каждой ячейки, и придайте границе белый цвет (такой же, как фон документа), создается впечатление невидимой границы:

Пример

table, th, td {
  border: 1px сплошной белый;
граница коллапса: коллапс;
}
th, td {
  background-color: #96D4D4;
}

Попробуйте сами »

Границы круглого стола

Со свойством border-radius границы получают закругленные углы:

Пример

table, th, td {
  граница: 1px сплошная черный;
радиус границы: 10px;
}

Попробуйте сами »

Пропустите границу вокруг таблицы, опустив table из селектора css:

Пример

th, td {
  border: 1px solid черный;
радиус границы: 10px;
}

Попробуйте сами »

Точечные границы таблицы

С помощью свойства border-style можно установить внешний вид границы.

Допускаются следующие значения:

  • с точкой     
  • пунктир     
  • твердый     
  • двойной     
  • канавка     
  • ребро     
  • вкладыш     
  • начало
        
  • нет     
  • скрытый     

Пример

й, тд {
стиль границы: пунктирный;
}

Попробуйте сами »

Цвет границы

С помощью свойства border-color можно установить цвет границы.

Пример

th, td {
цвет границы: #96D4D4;
}

Попробуйте сами »

❮ Предыдущая Далее ❯


НОВИНКА

Мы только что запустили
Видео W3Schools

Узнать

ВЫБОР ЦВЕТА
КОД ИГРЫ

Играть в игру

Лучшие учебники
Учебник по HTML
Учебник по CSS
Учебник по JavaScript
Учебник How To
Учебник по SQL
Учебник по Python
Учебник по W3. CSS
Учебник по Bootstrap
Учебник по PHP
Учебник по Java
Учебник по C++
Учебник по jQuery

8 900 Справочник по HTML
Справочник по CSS
Справочник по JavaScript
Справочник по SQL
Справочник по Python
Справочник по W3.CSS
Справочник по Bootstrap
Справочник по PHP
Цвета HTML
Справочник по Java
Справочник по Angular
Справочник по jQuery

Основные примеры
Примеры HTML
Примеры CSS
Примеры JavaScript
Примеры инструкций
Примеры SQL
Примеры Python
Примеры W3.CSS
Примеры Bootstrap
Примеры PHP
Примеры Java
Примеры XML
Примеры jQuery

FORUM | О

W3Schools оптимизирован для обучения и обучения. Примеры могут быть упрощены для улучшения чтения и обучения. Учебники, ссылки и примеры постоянно пересматриваются, чтобы избежать ошибок, но мы не можем гарантировать полную правильность всего содержания. Используя W3Schools, вы соглашаетесь прочитать и принять наши условия использования, куки-файлы и политика конфиденциальности.

Copyright 1999-2022 Refsnes Data. Все права защищены.
W3Schools работает на основе W3.CSS. . . . ?

  • Основы CMS: работа с таблицами HTML

    • Соответствие требованиям ADA | Пример базовой таблицы 1 | Пример базовой таблицы 2 | Примечания о HTML и таблицах | Примеры вариантов таблицы | Дополнительные ссылки на HTML и таблицы | См. также применение пользовательских стилей CSS к таблицам

    Соответствие требованиям ADA

    UH ожидает, что материалы на его веб-сайте будут соответствовать требованиям ADA, поэтому для таблицы HTML вам потребуется правильно сформированный код и семантическая разметка. Вы должны иметь возможность включать заголовки таблиц; и вы также можете рассмотреть возможность добавления подписей к таблицам и нижних колонтитулов таблиц.

    Базовая таблица с тремя столбцами, пример 1: объединенный заголовок

    Ниже показана базовая HTML-таблица с объединенной строкой заголовка над тремя столбцами и с UH — определено таблица применен стиль:

    Необязательный заголовок таблицы идет здесь
    Здесь находится заголовок объединенной таблицы
    Нижний колонтитул(ы) таблицы идет здесь
    Ряд 1 — Столбец 1 Строка 1 — Столбец 2 Строка 1 — Столбец 3
    Ряд 2 — Столбец 1 Строка 2 — Столбец 2 Строка 2 — Столбец 3
    Ряд 3 — Столбец 1 Строка 3 — Столбец 2 Строка 3 — Столбец 3
    Ряд 4 — Столбец 1 Строка 4 — Столбец 2 Строка 4 — Столбец 3

     

    HTML-код выглядит следующим образом:


       
       
           
               
           
       
       
           
               
      0 2 0

           
               
               
                >
           
               





    < td>Строка 3 — Столбец 2
               
           
           
               
               
           
       
    Здесь находится необязательный заголовок таблицы
    Заголовок объединенной таблицы
    Нижний колонтитул (нижние колонтитулы) таблицы
    Строка 1 — Столбец 1 Строка 1 – Столбец 2 Строка 1 – 9 0 
    Строка 2 — Столбец 1 строка 2 — столбец 2 строка 2 — столбец 3
    строка 3 — столбец 1 Строка 3 — Столбец 3
    Строка 4 — Столбец 1 2 900 Строка 4 — Столбец 2 Ряд 4 — Столбец 3

     

    Базовая таблица с тремя столбцами Пример второй: каждый столбец со своим заголовком

    Ниже показана базовая html-таблица, в которой каждый из трех столбцов имеет собственный заголовок, и с примененным стилем UH -defined table :

    Необязательный заголовок таблицы идет здесь
    Заголовок столбца 1 Заголовок столбца 2 Кол. 3 Заголовок
    Нижний колонтитул(ы) таблицы идет здесь
    Ряд 1 — Столбец 1 Строка 1 — Столбец 2 Строка 1 — Столбец 3
    Ряд 2 — Столбец 1 Строка 2 — Столбец 2 Строка 2 — Столбец 3
    Ряд 3 — Столбец 1 Строка 3 — Столбец 2 Строка 3 — Столбец 3
    Ряд 4 — Столбец 1 Строка 4 — Столбец 2 Ряд 4 — Колонка 3

     

    HTML-код выглядит следующим образом:


       
       
           
               
                  th>Col 1 Header
           
       
       
           
               







           
          
               
                 2
           





    < tr>
              
               
               
              0 0 0 2 body >

     

    ПРИМЕЧАНИЕ . Если вы копируете текст структуры таблицы с этой опубликованной веб-страницы для использования в качестве начальной таблицы, вы должны иметь возможность вставить его непосредственно во встроенный HTML-редактор CMS без сохранения лишнего форматирования и редактор WYSIWYG. затем должен увидеть его как HTML-таблицу, которую можно редактировать с помощью встроенных инструментов CMS.

     

    Примечания о HTML и таблицах

    В HTML теги могут состоять из набора открывающих и закрывающих тегов, таких как теги строки таблицы в таблице выше:

      или  они могут быть самозакрывающимися, например, тег изображения   или тег горизонтальной линейки

    В таблицах HTML каждая строка конкретно определяется материалом, который появляется между каждым набором тегов

    ….

    Индивидуальные ячейки данных определяются материалом, который появляется между каждым набором из

    тегов, вложенных в родительские теги строки .

    Вообще говоря, количество строк в таблице определяется количеством наборов тегов строк

    в таблице.

    Количество столбцов в таблице интерпретируется в зависимости от того, сколько

    наборов (так называемых «ячеек») включено в каждую строку.

    В правильно сформированной таблице каждая строка таблицы должна содержать равное количество ячеек либо в виде отдельных наборов, либо в виде объединенных ячеек. Ячейка с объявлением ‘colspan’ представляет объединенные ячейки и, таким образом, будет учитывать объявленное число. В строке заголовка выше colspan=»3″ означает, что одна ячейка теперь может учитывать три — две другие плюс себя. Если строки различаются по количеству ячеек, которые они могут учитывать, таблица может отображаться неправильно и может визуально казаться разбитой и/или показывать промежутки. Лица, которым для доступа к вашему контенту нужны программы чтения текста, обнаружат, что таблицы, которые плохо сформированы или в которых отсутствует четкая разметка заголовков и надписей, труднее интерпретировать.

    Вы можете заметить, что строка заголовка таблицы в примере окружена тегами строк типа «thead» , а тегом ячейки заголовка таблицы является «th» (заголовок таблицы) вместо обычного «td» (данные таблицы). ). Специальные теги позволяют лучше интерпретировать информацию строки заголовка с точки зрения ее связи с содержимым следующей ячейки, а также отображать ее в более отличном от остальной части таблицы стиле.

    Также обратите внимание, что область нижнего колонтитула , которая будет отображаться под последней строкой таблицы при просмотре на веб-странице, фактически определена в верхней части HTML-кода таблицы. Чтобы удалить ненужную строку нижнего колонтитула, удалите теги нижнего колонтитула

     . ..  и все, что между ними.

    ВАЖНО!
    В правильно сформированном HTML все теги должны быть правильно «вложены»:     открывать и закрывать полностью внутри окружающих их или «родительских» тегов; и закрытие до того, как тег однорангового уровня сможет открыться после него. Например, наборы тегов

    должны открываться после открывающего родительского тега и закрываться перед любым другим наборы, которые идут после него и до закрытия его/их тега «родительской» строки: .


    Примеры вариантов таблицы

    Без UH Настольный стиль | Полосатый стол | Полосатый и с окантовкой | Colspan Слияние | Слияние междурядий| Адаптивные примечания к таблице

    Пример таблицы без применения стиля
    UH :
    Необязательный заголовок таблицы
    Col 1 Header Col 1 Header0
    Нижний колонтитул(ы) таблицы
    строка 1 — столбец 1 строка 1 — столбец 2 строка 1 — Столбец 3
    Строка 2 – Столбец 1 Строка 2 – Столбец 2
          3
    строка 3 — столбец 1 строка 3 — столбец 2 строка 3 — столбец 3
    Строка 4 – Столбец 1 Строка 4 – Столбец 2 Строка 4 – Столбец 3
    . ..
    Здесь идет заголовок таблицы
    Здесь находится заголовок объединенной таблицы
    Нижний колонтитул(ы) таблицы идет здесь
    Ряд 1 — Столбец 1 Строка 1 — Столбец 2 Строка 1 — Столбец 3
    Ряд 2 — Столбец 1 Строка 2 — Столбец 2 Строка 2 — Столбец 3
    Ряд 3 — Столбец 1 Строка 3 — Столбец 2 Строка 3 — Столбец 3
    Ряд 4 — Столбец 1 Строка 4 — Столбец 2 Ряд 4 — Колонка 3

     


    Пример таблицы с добавленным стилем table-striped и без строки нижнего колонтитула:
    Здесь идет заголовок таблицы
    Стол с полосатым рисунком
    Ряд 1 — Столбец 1 Строка 1 — Столбец 2 Строка 1 — Столбец 3
    Ряд 2 — Столбец 1 Строка 2 — Столбец 2 Строка 2 — Столбец 3
    Ряд 3 — Столбец 1 Строка 3 — Столбец 2 Строка 3 — Столбец 3
    Ряд 4 — Столбец 1 Строка 4 — Столбец 2 Строка 4 — Столбец 3

     

    В HTML тег

    теперь записывается так:

     


    Пример таблицы с добавленными стилями table-striped и table-bordered и без строки нижнего колонтитула:
    Здесь идет заголовок таблицы
    Таблица с обоими стилями «стол-полосатый» и «стол-бордюр»
    Ряд 1 — Столбец 1 Строка 1 — Столбец 2 Строка 1 — Столбец 3
    Ряд 2 — Столбец 1 Строка 2 — Столбец 2 Строка 2 — Столбец 3
    Ряд 3 — Столбец 1 Строка 3 — Столбец 2 Строка 3 — Столбец 3
    Ряд 4 — Колонка 1 Строка 4 — Столбец 2 Строка 4 — Столбец 3

     

    В HTML тег

    теперь записывается так:

    Имена стилей не могут содержать пробелы, но могут содержать тире. Обратите внимание, что все различные имена стилей собраны вместе внутри набора прямых кавычек, а каждый отдельный стиль отделен пробелом. Стили можно добавлять и удалять, изменяя имена стилей, которые появляются внутри кавычек.

     


    Пример таблицы с добавленными стилями, без нижнего колонтитула —

    и с ячейками, объединенными между столбцами, демонстрирует использование ‘colspan’
    Здесь идет заголовок таблицы
    Таблица с объединенными ячейками с использованием colspan
    Ряд 1 — Столбец 1 Строка 1 — Столбец 2 Строка 1 — Столбец 3
    Ряд 2 — Столбец 1 Строка 2 — Столбец 2 Строка 2 — Столбец 3
    Ряд 3 — Столбец 1 Строка 3 — ячейки столбца 2 и 3 объединены в одной строке
    Ряд 4 — Столбец 1 Строка 4 — Столбец 2 Строка 4 — Столбец 3

     

    В HTML вторая ячейка третьей строки теперь записывается как
    , поэтому в той же строке теперь требуется на один набор 9 меньше. 0283 теги:





      




      
      
      


      
      
      


      
       < td colspan="2">Строка 3 — ячейки столбцов 2 и 3 объединены в одну строку


      
       < td>Строка 4 — Столбец 2
      


    Здесь находится заголовок таблицы
    Таблица с объединенными ячейками с использованием ‘colspan’
    Строка 1 — Столбец 1 Строка 1 — Столбец 2 Строка 1 — Столбец 3
    Строка 2 — Столбец 1 Строка 2 — Столбец 2 Строка 2 — Столбец 3
    Строка 3 — Столбец 1
    Строка 4 — столбец 1 Строка 4 — Столбец 3


    Пример таблицы с добавленными стилями, без нижнего колонтитула —

    и с ячейками, объединенными между строками, показывает использование rowspan
    Здесь идет заголовок таблицы
    Таблица с объединенными ячейками с использованием rowspan
    Ряд 1 — Столбец 1 Строка 1 — Столбец 2 Строка 1 — Столбец 3
    Строки 2 и 3
    Столбец 1
    ячейки объединены
    		Строка 2 — Столбец 2 Строка 2 — Столбец 3
    Ряд 3 — Столбец 2 Строка 3 — Столбец 3
    Ряд 4 — Столбец 1 Строка 4 — Столбец 2 Строка 4 — Столбец 3

     

    В HTML тег открывающей ячейки второй строки теперь записывается как
    , поэтому строку , следующую за , теперь также необходимо скорректировать, чтобы на один набор меньше тега.
    Как следует из ‘rowspan’, объявленное число указывает, сколько строк будет затронуто, и, естественно, окончательные результаты будут зависеть от всей структуры таблицы.





      




      
      
      


      
      
      



      


      
      
      


    Здесь находится заголовок таблицы
    Таблица с объединенными ячейками с использованием rowspan
    Строка 1 — Столбец 1 Строка 1 — Столбец 2 Строка 1 — Столбец 3
    Строки 2 и 3
    Столбец 1
    ячейки объединены    		 Строка 2 — Столбец 2 Строка 2 — Столбец 3
    Строка 3 — Столбец 2 Строка 3 — Столбец 3
    Строка 4 — Столбец 1 Строка 4 — Столбец 2 Строка 4 — Столбец 3

     

     

    Примечания к адаптивной таблице

    Даже хорошо сформированный код может дать сбой, когда веб-страницы, реагирующие на размер экрана, пытаются представить табличный материал: например. HTML-таблицы. С широкими таблицами некоторая информация может быть скрыта при узком экране. Чтобы помочь, некоторые браузеры могут отображать таблицы с полосой прокрутки внизу таблицы. Некоторые браузеры могут попытаться и потерпеть неудачу.

    Стили Bootstrap, специфичные для UH, должны помочь вашим таблицам изящно адаптироваться в различных ситуациях. Однако в некоторых случаях вы также можете рассмотреть возможность использования стиля «адаптивного к таблице», чтобы облегчить адаптацию ваших таблиц (пример ниже). Стиль «отзывчивый к таблице» может помочь сжать столбец и/или обеспечить доступность полосы прокрутки, в зависимости от браузера.

    Ниже приведен пример таблицы со стилем «table-responsive», добавленным к открывающему тегу таблицы:

    >

    Здесь может располагаться заголовок «отзывчивой» таблицы
    Заголовок столбца 1 Заголовок столбца 2 Заголовок столбца 3 Заголовок столбца 4 Колонка 5 Заголовок Колонка 6 Заголовок Колонка 7 Заголовок Колонка 8 Заголовок
    Нижний колонтитул таблицы может быть здесь
    Ряд 1 — Столбец 1 Строка 1 — Столбец 2 Строка 1 — Столбец 3 Строка 1 — Столбец 4 Строка 1 — Столбец 5 Ряд 1 — Столбец 6 Ряд 1 — Столбец 7 Ряд 1 — Столбец 8
    Ряд 2 — Столбец 1 Строка 2 — Столбец 2 Строка 2 — Столбец 3 Строка 2 — Столбец 4 Строка 2 — Столбец 5 Ряд 2 — Столбец 6 Ряд 2 — Столбец 7 Ряд 2 — Столбец 8
    Ряд 3 — Столбец 1 Строка 3 — Столбец 2 Ряд 3 — Столбец 3 Строка 3 — Столбец 4 Строка 3 — Столбец 5 Ряд 3 — Столбец 6 Ряд 3 — Столбец 7 Ряд 3 — Столбец 8
    Ряд 4 — Столбец 1 Строка 4 — Столбец 2 Строка 4 — Столбец 3 Ряд 4 — Столбец 4 Строка 4 — Столбец 5 Ряд 4 — Столбец 6 Ряд 4 — Столбец 7 Ряд 4 — Столбец 8

     
    Сравните предполагаемые браузеры вашей аудитории со следующей таблицей, не использующей «табличный отклик»:

    Заголовок таблицы без ответа может быть здесь
    Заголовок столбца 1 Заголовок столбца 2 Заголовок столбца 3 Заголовок столбца 4 Колонка 5 Заголовок Колонка 6 Заголовок Колонка 7 Заголовок Колонка 8 Заголовок
    Нижний колонтитул таблицы может быть здесь
    Ряд 1 — Столбец 1 Строка 1 — Столбец 2 Строка 1 — Столбец 3 Ряд 1 — Столбец 4 Строка 1 — Столбец 5 Ряд 1 — Столбец 6 Ряд 1 — Столбец 7 Ряд 1 — Столбец 8
    Ряд 2 — Столбец 1 Строка 2 — Столбец 2 Строка 2 — Столбец 3 Строка 2 — Столбец 4 Строка 2 — Столбец 5 Ряд 2 — Столбец 6 Ряд 2 — Столбец 7 Ряд 2 — Столбец 8
    Ряд 3 — Столбец 1 Строка 3 — Столбец 2 Строка 3 — Столбец 3 Строка 3 — Столбец 4 Строка 3 — Столбец 5 Ряд 3 — Столбец 6 Ряд 3 — Столбец 7 Ряд 3 — Столбец 8
    Ряд 4 — Столбец 1 Строка 4 — Столбец 2 Строка 4 — Столбец 3 Ряд 4 — Столбец 4 Строка 4 — Столбец 5 Ряд 4 — Столбец 6 Ряд 4 — Столбец 7 Ряд 4 — Столбец 8

     

    В противном случае для больших, длинных или широких таблиц редакторам может потребоваться изучить дополнительные параметры CSS, JS и т.

    Добавить комментарий

    Ваш адрес email не будет опубликован. Обязательные поля помечены *