Тег TD, атрибут height

Атрибут height

Браузер сам устанавливает высоту таблицы и ее ячеек исходя из их содержимого. Однако при использовании атрибута height высота ячеек будет изменена. Здесь возможны два варианта. Если значение height меньше, чем содержимое ячейки, то этот атрибут будет проигнорирован. В случае, когда установлена высота ячейки, превышающая ее содержимое, добавляется пустое пространство по вертикали.

Синтаксис

Значения

Любое целое значение в пикселах или процентах от доступного пространства.

Значение по умолчанию

Высота вычисляется на основе содержимого ячейки.

Аналог CSS

Валидация

Использование этого атрибута осуждается спецификацией HTML, валидный код получается только при использовании переходного .

       
 
Ячейка 1
 
 
  

Не выкладывайте свой код напрямую в комментариях, он отображается некорректно. Воспользуйтесь сервисом cssdeck.com или jsfiddle.net, сохраните код и в комментариях дайте на него ссылку. Так и результат сразу увидят.

Типы тегов

HTML5

Блочные элементы

Строчные элементы

Универсальные элементы

Нестандартные теги

Осуждаемые теги

Видео

Документ

Звук

Изображения

Объекты

Скрипты

Списки

Ссылки

Таблицы

Текст

Форматирование

Формы

Фреймы

Источник

HTML Table Sizes

HTML tables can have different sizes for each column, row or the entire table.

Use the style attribute with the width or height properties to specify the size of a table, row or column.

HTML Table Width

Example

Set the width of the table to 100%:

Note: Using a percentage as the size unit for a width means how wide will this element be compared to its parent element, which in this case is the element.

HTML Table Column Width

Example

Set the width of the first column to 70%:

HTML Table Row Height

To set the height of a specific row, add the style attribute on a table row element:

Example

Set the height of the second row to 200 pixels:

HTML Exercises

COLOR PICKER

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials

Top References

Top Examples

Get Certified

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Источник

Как установить высоту для строк таблицы?

Подскажите как установить высоту для содержимого таблицы, чтобы не было простыни текста как в коде. Структура приходит динамично , но статична только таблица , ну то есть table->tbody->tr->td
И нужно чтобы была макс высота у ячеек на случай если текста много. В результате должна быть таблица с одинаковыми по высоте ячейками

Простой 16 комментариев

Задайте размеры span’у и нужный overflow.
Но это не точно.
Потому что формулировка «чтобы не было простыни текста» не однозначна и самый напрашивающийся не имеющий отношения к высоте ответ: удалите эту простыню.

overflow-y:scroll;
ты для начала сформулируй что ты хочешь получить на выходе
тут не экстрасенсы сидят

Излишки текста-то куда деваться должны?
Скрываться или ширина таблицы должна увеличиваться (т.е. горизонтальная прокрутка у body или оборачивающего блока) или еще как-нибудь.

John Johnson, тогда я написала ответ в первом комментарии, задавайте размеры спану.

Альтернатива: обрезать текст js’ом или сразу на бэке.

У тебя таблица такая.

Как ты хочешь ей высоту задать, у тебя и так все ячейки одной высоты? Давай примеры.

irishmann,

Примерно вот такое хочу увидеть.

Ситуация такая с бека приходит простыня текста и нужно показывать малую часть на фронте, а при ховере уже в тултипе показывать всё.

И у меня проблема в первой части этой формулировки, я не могу ужать ячейки таблиц. Ну то есть таких tr может быть страниц на 100 и получается огромная простыня в случае если текста много приходит.

И я надеялся что всё же можно ужать tr или td по высоте чтобы они были фиксированной не такой огромной высоты как на скрине что ты прислал.

Ну и ещё момент что я не вижу содержимое структуры таблицы. То есть где-то есть span где то его нет. Стили могу задать только для таблицы , ячеек и tr

Источник

CSS Table Size

The width and height of a table are defined by the width and height properties.

The example below sets the width of the table to 100%, and the height of the elements to 70px:

Firstname	Lastname	Savings
Peter	Griffin	$100
Lois	Griffin	$150
Joe	Swanson	$300

Example

To create a table that should only span half the page, use width: 50% :

Firstname	Lastname	Savings
Peter	Griffin	$100
Lois	Griffin	$150
Joe	Swanson	$300

Example

COLOR PICKER

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials

Top References

Top Examples

Get Certified

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Источник