Таблицы HTML легко создавать, как только вы понимаете основы строк и столбцов, а также когда вы понимаете, когда все в порядке использовать таблицу и когда вы должны их избегать.
Краткая история таблиц и веб-дизайна
Много лет назад, до приемлемого уровня CSS и веб-стандартов, веб-дизайнеры использовали HTML-код
чтобы создать макет страницы для сайтов. Проекты веб-сайтов будут «нарезаны» на маленькие кусочки, такие как головоломка, а затем объединены с таблицей HTML для визуализации в браузере, как и предполагалось. Это был очень сложный процесс, который создал много дополнительной разметки HTML и который никогда не будет использоваться сегодня в многоэкранном мире, на котором живут наши веб-сайты. Поскольку CSS стал приемлемым методом визуализации и макета веб-страницы, использование таблиц для этого стало избегали, и многие веб-дизайнеры ошибочно полагали, что «таблицы были плохими». Это было и не соответствует действительности. Таблицы для макета плохие, но они все еще имеют место в веб-дизайне и HTML, а именно для отображения табличных данных, таких как календарь или расписание поездов. Для этого контента использование таблицы по-прежнему является приемлемым и хорошим подходом.
Итак, как вы планируете таблицу? Начнем с создания простой таблицы 2x2. Это будет иметь 2 столбца (это вертикальные блоки) и 2 строки (горизонтальные блоки). После того, как вы построили таблицу 2x2, вы можете построить любую таблицу размеров, которую просто хотите добавить, добавив дополнительные строки или столбцы.
Вот как
-
Сначала откройте стол
-
Откройте первую строку с тегом tr
-
Откройте первый столбец с тегом td
|
-
Напишите содержимое ячейки
-
Закройте первую ячейку и откройте вторую
|
-
Напишите содержимое второй ячейки
-
Закройте вторую ячейку и закройте строку
-
Напишите вторую строку точно так же, как первая
| | |
-
Затем закройте таблицу
-
Это оно!
Вы также можете добавить заголовки таблиц в таблицу, используя
элемент. Эти заголовки таблиц заменяют части «таблицы данных» в первой строке таблицы, например:
| название | Роль | | Джереми | дизайнер | Дженнифер | разработчик |
Когда эта страница будет отображаться в браузере, эта первая строка с заголовками таблицы по умолчанию будет выделена жирным шрифтом, и они будут центрироваться в ячейке таблицы, в которой они отображаются.
Итак, правильно ли использовать таблицы в HTML?
Да, если вы не используете их для целей макета, все в порядке использовать таблицы. Если вам нужно отобразить табличную информацию, это способ сделать это. Фактически, избегая таблицы из-за некоторой ошибочной чистоты, чтобы избегать этого законного элемента HTML, это так же обратное, как использование их в целях макета в этот день и возраст.
Автор Дженнифер Кирин. Под редакцией Джереми Жирарда.
|
