понедельник, 17 сентября 2012 г.

Как вставить (создать) таблицу в blogger

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

Вариант 1. Набрать код вручную

Если таблица не очень большая и не очень сложная по структуре, её можно создать вручную, прямо в редакторе поста (в режиме HTML). Синтаксис таблицы весьма прост, вот элементарный пример:
<table border="1">
 <tr>
  <td>строка 1, столбец 1</td>
  <td>строка 1, столбец 2</td>
 </tr>
 <tr>
  <td>строка 2, столбец 1</td>
  <td>строка 2, столбец 2</td>
 </tr>
</table>

А выглядит это так:
строка 1, столбец 1строка 1, столбец 2
строка 2, столбец 1строка 2, столбец 2

Подробнее об использовании тега table уместно отсылать к справочникам по HTML (например, http://htmlbook.ru). Отмечу, ещё два полезных атрибута colspan и rowspan, которые позволяют объединять ячейки горизонтально и вертикально соответственно.

Пример использования rowspan:
<table border="1"><tbody>
    <tr>
        <td rowspan="2">строка 1 и 2, столбец 1</td>
        <td>строка 1, столбец 2</td>
    </tr>
    <tr>
        <td>строка 2, столбец 2</td>
    </tr>
</tbody></table>

строка 1 и 2,
столбец 1
строка 1, столбец 2
строка 2, столбец 2

Пример использования colspan:
<table border="1"><tbody>
    <tr>
        <td colpsan="2">строка 1, столбец 1 и 2</td>
    </tr>
    <tr>
        <td>строка 2, столбец 1</td>
        <td>строка 2, столбец 2</td>
    </tr>
</tbody></table>

строка 1, столбец 1 и 2
строка 2, столбец 1строка 2, столбец 2

Вариант 2. Использовать HTML-редакторы

Для создания таблиц можно использовать HTML-редактор, например, editplus, DreamWeaver. Создать с его помощью таблицу - плёвое дело. Потом останется только её скопировать. Фишка в том, что такие редакторы совмещают в себе инструменты для работы с HTML-элементами. Например, там есть кнопка "вставить таблицу". С другой стороны вы всегда можете посмотреть конкретный HTML код, который был добавлен, после чего скопировать его в Blogger.


Вариант 3. Использовать генераторы таблиц

Обзор некоторых редакторов сделан здесь. Идея состоит в том, что Вы задаёте параметры таблицы, а на выходе готовый HTML-код. Вот несколько ссылок:

Вариант 4. Вставка таблицы в виде картинки

Самый простой и не самый худший способ. Вы создаете или уже имеете таблицу в Excel или любой другой программе. Делаете снимок этой таблицы ("скриншот") и размещаете в виде картинки. Главные достоинства такого способа:
  • простота;
  • хороший контроль над тем как выглядит таблица;
  • возможность добавлять к таблице пояснения, маркеры или что еще (с помощью графический редакторов).

Рекомендую почитать:
"Когда я вставляю таблицу в свое сообщение, в ней появляются лишние пустые строки. Как их удалить?"

7 комментариев: