А стол — отличный способ систематизированно представить большой объем информации. Данные о продажах, посещаемость веб-страниц, тенденции фондового рынка и оценки студентов являются примерами информации, которая часто представлена в таблицах..
При добавлении таблицы на веб-страницу с помощью HTML, может быть более привлекательным визуально расположить его по центру страницы. Центрирование текста и изображений обычно выполняется с помощью выравнивание текста класс или через CSS, но центрирование стола требует другого подхода. Ниже приведены подробные сведения о том, как центрировать таблицу на веб-странице..
Центрирование таблицы в HTML
При добавлении таблицы на веб-страницу по умолчанию она выравнивается по левой стороне страницы или контейнера, как показано ниже..
| ХИТЫ | МЕСЯЦ | ОБЩЕЕ УВЕЛИЧЕНИЕ |
| 324 497 | Январь 1998 | — |
| 436 699 | Февраль 1998 г. | 112 172 |
HTML исходный код для приведенной выше таблицы следующее.
<стиль таблицы=»граница: сплошной черный 1px»> <tr> <тд><б>ХИТЫ</ b></ тд> <тд><б>МЕСЯЦ</ b></ тд> <тд><б>ОБЩЕЕ УВЕЛИЧЕНИЕ</ b></ тд> </ tr> <tr> <тд>324 497</ тд> <тд>Январь 1998 </ тд> <td style=»выравнивание текста: центр»>-</ тд> </ tr> <tr> <тд>436 699</ тд> <тд>Февраль 1998 г.</ тд> <td style=»выравнивание текста: центр»>112 172</ тд> </ tr> </стол>
Чтобы центрировать эту таблицу, вам нужно добавить ; маржа слева: авто; маржа справа: авто; до конца стиль атрибут в <стол> тег. Тег таблицы будет выглядеть следующим образом.
<стиль таблицы=»граница: сплошной черный 1px; крайнее левое: авто; правое поле: авто;»>
Изменение стиль атрибут в <стол> тег, как показано выше, приводит к центру таблицы на веб-странице, как показано ниже.
| ХИТЫ | МЕСЯЦ | ОБЩЕЕ УВЕЛИЧЕНИЕ |
| 324 497 | Январь 1998 | — |
| 436 699 | Февраль 1998 г. | 112 172 |
Кончик
Вы можете добавить параметры в стиль атрибут в <стол> , чтобы сделать таблицу более привлекательной. Добавление отступ: 2 пикселя; и интервал границы: 20 пикселей; добавляет интервал между точками данных и границей, чтобы улучшить читаемость.