-Цитатник

Без заголовка - (0)

Шалом,Израиль!(Путешествие по Галилее ч.1)   Добрый  день ,мои ПЧ друзья! ...

Как опубликовать свой материал в Сообществе? - (0)

Как опубликовать свой материал в Сообществе?   Дорогие и Уважае...

Начинающим на ЛиРу - (0)

Начинающим на ЛиРу Зарегистрировать твой ник! Серия сообщений "Для ЛиРу": Часть...

Тег more или Как убрать текст под кат - (0)

Помощь новичкам: Тег more или Как убрать текст под кат По просьбам читателей - новичков, попроб...

ВЕЛИКИЙ ПРАЗДНИК ПАСХИ НА КАРТИНАХ ИЗВЕСТНЫХ ХУДОЖНИКОВ - (0)

ВЕЛИКИЙ ПРАЗДНИК ПАСХИ НА КАРТИНАХ ИЗВЕСТНЫХ ХУДОЖНИКОВ ВЕЛИКИЙ ПРАЗДНИК ПАСХИ НА КАРТИНАХ ИЗВЕ...

 -Рубрики

 -Я - фотограф

КРЫМСКАЯ ВОЙНА 1854 - 1855 г.г.


 -Всегда под рукой

 -

Быстрый переход по страницам блога Краснофлотец:

 -Поиск по дневнику

Поиск сообщений в Краснофлотец

 -Подписка по e-mail

 

 -Статистика

Статистика LiveInternet.ru: показано количество хитов и посетителей
Создан: 09.07.2009
Записей: 4010
Комментариев: 933
Написано: 6326


Ещё о таблицах

Среда, 28 Октября 2009 г. 18:41 + в цитатник
Цитата сообщения FlashStudio Ещё о таблицах



Название "Ещё о таблицах" может звучать немного вызывающе. Если вы уже можете создавать таблицы, то уже абсолютно ничто в HTML не может смутить вас.

Что же ещё?

При создании таблиц используются два атрибута: colspan и rowspan.

Colspan - сокращение от "column span/охват столбцов". Colspan используется в тэге <td> для специфицирования того, сколько столбцов охватывает данная ячейка:

Пример 1:


           <table border="1">
             <tr>
               <td colspan="3">Cell 1</td>
             </tr>
             <tr>
               <td>Cell 2</td>
               <td>Cell 3</td>
               <td>Cell 4</td>
             </tr>
           </table>

будет выглядеть в браузере:

Cell 1
Cell 2 Cell 3 Cell 4

Установка colspan "3", заставляет ячейку в первом ряду охватывать три столбца. Если установим colspan "2", ячейка охватит только два столбца, и понадобится вставить дополнительные ячейки в первый ряд, чтобы ячейки ровно распределились на два ряда.

Пример 2:


           <table border="1">
             <tr>
               <td colspan="2">Cell 1</td>
               <td>Cell 2</td>
             </tr>
             <tr>
               <td>Cell 3</td>
               <td>Cell 4</td>
               <td>Cell 5</td>
             </tr>
           </table>

будет выглядеть в браузере:

Cell 1 Cell 2
Cell 3 Cell 4 Cell 5

А как насчёт rowspan?

Как вы уже могли догадаться, rowspan специфицирует, сколько рядов охватывает данная ячейка:

Пример 3:


           <table border="1">
             <tr>
               <td rowspan="3">Cell 1</td>
               <td>Cell 2</td>
             </tr>
             <tr>
               <td>Cell 3</td>
             </tr>
             <tr>
               <td>Cell 4</td>
             </tr>
           </table>

будет выглядеть в браузере:

Cell 1 Cell 2
Cell 3
Cell 4

В этом примере rowspan имеет значение "3" в ячейке Cell 1. Это указывает, что ячейка должна охватывать три ряда (свой собственный ряд плюс ещё два). Cell 1 и Cell 2 при этом остаются в одном ряду, а Cell 3 и Cell 4 образуют отдельные ряды.

Удивлены? Ладно, это не так сложно. Неплохо будет нарисовать таблицу на бумаге до начала работы в HTML.

Неудивительно? Тогда вернитесь к началу и создайте пару таблиц с использованием colspan и rowspan.

Рубрики:  Web дизайн
Метки:  

 

Добавить комментарий:
Текст комментария: смайлики

Проверка орфографии: (найти ошибки)

Прикрепить картинку:

 Переводить URL в ссылку
 Подписаться на комментарии
 Подписать картинку