Как задать ширину таблицы?

3 ноября 2014 г. Просмотров: 723
Инструкции языка HTML (HyperText Markup Language или «Язык разметки гипертекста»), которые формируют таблицы, размещаемые в веб-страницах, предусматривают довольно большое число дополнительных параметров. Это позволяет, в отличие от других блочных элементов, задавать размеры не только с помощью языка CSS (Cascading Style Sheets или «Каскадные таблицы стилей»), но и средствами самого HTML.

Инструкция

  • Используйте атрибут width тега table для указания ширины таблицы в пикселах. Тег (инструкция языка HTML) table состоит из открывающей () и закрывающей () частей, между которыми находятся теги, формирующие строки и ячейки таблицы. В открывающий тег можно поместить дополнительные параметры (атрибуты), список которых для каждого конкретного тега определяется международными стандартами. Для тега table этими стандартами разрешено использование атрибута width, который задает ширину таблицы в пикселах. Выглядеть HTML-код простейшей таблицы с таким тегом, определяющим ширину в 500 пиксел, может, например, так:
  • 1я ячейка2я ячейка

  • Добавляйте символ % к значению атрибута width, если ширину таблицы надо указать в процентах, а не в пикселах:
  • 1я ячейка2я ячейка

    Обратите внимание на то, что эти проценты не обязательно будут отсчитываться от ширины окна браузера. Здесь имеет значение структура документа - как вложенная матрешка не может быть шире той, в которую она вложена, так и 100% ширины таблицы не может быть больше ширины родительского элемента. Например, если таблица находится внутри блока div, то за 100% будет приниматься ширина этого блока.

  • Используйте инструкции языка описания стилей, если хотите в одном месте исходного кода задать одинаковую ширину таблицам, размещенным в веб-странице. Для этого сначала поместите в заголовочную часть HTML-кода (между и ) открывающий и закрывающий теги, ограничивающие инструкции языка CSS:
  • /* здесь будут CSS-инструкции */

    Затем между этими тегами поместите такой CSS-код:table {width: 100px;}Здесь table указывает на то, что помещенное внутрь фигурных скобок описание должно быть применено ко всем тегам table, встречающимся в коде страницы. Ну а параметр width задает ширину. Здесь тоже можно использовать относительную ширину в процентах.

  • Указывайте в CSS-коде и в HTML-теге table имя класса, если задать ширину надо не для всех таблиц, а только для одной или нескольких. Например, пусть класс, отмечающий группу узких таблиц, называется tiny. Тогда описание его стиля может выглядеть так:table.tiny {width: 100px;}А соответствующий тег одной из таблиц в HTML-коде - так:
  • 1я ячейка2я ячейка

    Оцените статью!