Главная
Друзья! Пожалуйста не нервничайте! Скоро все заработает... у нас генеральная уборка...

Таблица по центру, html

Таблица посередине страницы - этим сегодня займися! Зачем нужно ставить таблицу посередине!? Как правило большинство сайтов располагаются посередине страницы html. Поэтому нужно это уметь делать! И в любом случае может пригодиться!

Мы уже написали несколько страниц о таблицах

На самом деле поставить таблицу по центру очень просто! Только требуется ввести соответствующее свойство!

А именно, нужно поставить такую строчку:

align="center"

А должна получиться такая строчка:

<table  width="200" border="1" align="center">

Смотрим пример:

Пример таблицы по центру с атрибутом align="center"
Не забываем, что бордюр border="1" можно убрать!

Он поставлен только для того, чтобы вы могли увидеть таблицу посередине, а иначе никак!

Поставить таблицу посередине с помощью css

Добавим в класс - margin: auto;...

Стили:

.table_center_by_css {

width: 300px;

border: 1px solid #000;

margin: auto;

}

Таблица:

<table class="table_center_by_css">

  <tr>

    <td>Пример таблицы по центру с помощью css</td>

  </tr>

</table>

Результат:

Пример таблицы по центру с помощью css

Ещё:

Что ищут пользователи со словами таблица посередине, кроме выше рассказанных случаев !?

1.

текст в таблице по центру html

Для иллюстрации данного запроса - текст в таблице по центру html - нам потребуется таблица -возьмем верхнюю таблицу растянем её на весь блок, поставим ширину 100%

Стиль:

.table_with_text_on_center {

text-align: center;

width: 100%;

border: 1px solid #030303;

}

Таблица:

<table class="table_with_text_on_center">

  <tr>

    <td>Текст посередине таблицы</td>

  </tr>

</table>

 

Результат:

Текст посередине таблицы

2.

html картинка в таблице по центру

Ничего не меняем в верхней таблице, кроме надписи в самой таблице и вставим код картинки вовнутрь:

Картинка:

<img src="http://dwweb.ru/__a-data/FOTO/css/figure/bear.jpg">

Результат:

html картинка в таблице по центру