HTML5 #7 Таблица (Table)

[@miZnIce01]

Теги для создания таблиц. Таблицы строятся последовательно вложенными тегами: 1. Во-первых идёт главный образующий тег . 2. После тега table идёт тег заголовка (если требуется) 3. Далее таблица делится на три основные части: а) - строка заголовка/шапка таблицы. Нужен для хранения одной или нескольких строк, которые представлены вверху таблицы. Используется только 1 раз в 1 таблице. Чтобы заголовок был выделен жирным шрифтом, вместо тега td нужно использовать тег . б) - основная часть таблицы. Предназначен для хранения основного контента таблицы. Может содержать неограниченное количество строк. Может повторятся несколько раз в 1 таблице. в) - низ таблицы/футер/”подвал” (итоги, результаты). Нужен для хранения одной или нескольких строк, которые идут внизу таблицы. Используется только 1 раз в 1 таблице. Эти теги идут строго друг за другом. Чтобы образовать строку таблицы, используется тег (table row, табличная строка). Чтобы образовать ряд таблицы (ячейку с информацией), используется тег (table data, данные). Ячейка таблицы записывается уже с какой-либо информацией. Чтобы объединить несколько ячеек, используется тег td с атрибутами: 1. Colspan - объединяет ячейки по горизонтали. 2. Rowspan - объединяет ячейки по вертикали. В качестве значений указываются числа, которые отображают сколько ячеек должно быть объединено.

[@YauhenKavalchuk]

В целом, не плохой краткий конспект лекции!)

[@olehyefimenko6693]

Спасибо за курс и проделанную тобой работу! Благодаря твоим курсам узнал много нового! Ну а с моей стороны - лайк, подписка, комментарий!

[@YauhenKavalchuk]

👍

[@prostoproger1393]

Спасибо огромное!!! Раньше не понимал как объединять ячейки Теперь всё стало ясно и понятно )))) Хорошее видео, всё четко , ясно и понятно

[@КостянЕрмаков-е9ю]

Ох уж эти таблицы))

[@nonamenoproblem.6372]

Благодарю автора за познавательный кронтент.

[@YauhenKavalchuk]

Благодарю за отзыв

[@DmitryShelestrans]

Большое спасибо!

[@AnnaCh-tv1jj]

Спасибо Вам большое!

[@YauhenKavalchuk]

Пожалуйста

[@dmytrogorski2839]

[@YauhenKavalchuk]

👍

[@user_with_params1286]

Евгений, здравствуйте! Пытался повторять за Вами, но, к сожалению, сами границы таблицы без добавления соответствующего атрибута "border" у меня не появлялись. Пробовал на Chrome и на Edge. Спасибо!

[@YauhenKavalchuk]

Что бы границы отображались я добавил стиль

[@user_with_params1286]

@@YauhenKavalchuk Спасибо! Сразу не заметил этого :( Учусь только.

[@chepelevdmitrii6378]

Спасибо за курс! А почему в репозитории курса, для таблиц вы не используете тег ? В смысле это не так важно или не заметили?

[@YauhenKavalchuk]

Этот тэг не обязательный. Просто с точки зрения семантики, он более логично отделяет разные секции таблицы друг от друга

[@chepelevdmitrii6378]

@@YauhenKavalchuk Есть еще вопрос (спасибо Евгений за ответ, за курс, лайкаю все что просматриваю, действительно здорово!) Вопрос - как учить? или что должен запомнить? Просмотрел видео, вслед за вами набираю практически все в Visual Studio Code, пытаюсь пересматривать дополнительно вчера просмотренное и понимаю что в голове остается 1-2%. То есть учеба подразумевает буквально перепись атрибутов с тегами и их зубрежка? или примерно столько в голове и должно оставаться на начальных этапах или могли бы вы поделиться как вы учили? Извиняюсь, если это глупый вопрос!

[@ВладимирСимоненко-э3ж]

@@chepelevdmitrii6378 выучил в итоге? работаешь?

[@fire_maps0280]

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

[@YauhenKavalchuk]

Я добавил стиль для границы. Поэтому у меня она видна. Можете посмотреть в репозитории курса

[@solo-angel]

А про какой валидатор тегов идет речь?

[@YauhenKavalchuk]

W3c validator

[@aureliansoul]

Я еще далека от этого, но в дальнейшем можно ведь как-то будет преобразовывать автоматически таблицы, например из excel в html код?

[@YauhenKavalchuk]

Да, на это даже есть специальные сервисы

[@Nikitosss91]

По css такой же курс будет, уважаемый ?

[@YauhenKavalchuk]

Пока не знаю

[@Nikitosss91]

@@YauhenKavalchuk было бы просто волшебно

[@YauhenKavalchuk]

Я знаю) В планах есть, но не в этом году)

[@azizxon_shaxodjayev]

Здравствуйте. У меня возникла такая проблема. Пишу теги, а у меня просто слово которое я написал. Помогите пожалуйста

[@YauhenKavalchuk]

Tab в конце нужно нажимать и должна срабатывать автозамена

[@azizxon_shaxodjayev]

@@YauhenKavalchuk Спасибо, попробую

[@PavloVoronyuk]

Таблицы используются для верстки email. Если теперь стили нужно писать в css, как тогда правильно писать валидный код для таблиц ?

[@YauhenKavalchuk]

Это совсем другой случай

[@gesaffelsteinisallyouneed]

блин как быть? пишу вроде правильно, даже скачал и вставил ваш код из githab но рамка вокруг таблицы не появляется(

[@YauhenKavalchuk]

Если копировали с GitHub проблем быть не должно. Проверьте внимательно код, там в head есть тэг style со стилями

[@gesaffelsteinisallyouneed]

@@YauhenKavalchuk да у меня не было тега стайл^ спасибо

[@ЭйЭй-ы1и]

привет, автор! а ты сейчас кто по должности, если не секрет?

[@ЭйЭй-ы1и]

если имеется таковая(пс, если тимлид, то почему выбрал именно это, а не техлид или архитектора), интересен твой ответ!!!

[@YauhenKavalchuk]

Можете посмотреть в профиле LinkedIn

[@ЭйЭй-ы1и]

@@YauhenKavalchuk увидел, что синьор, а почему не тимлид, не нравится или другие причины, могли бы ответить?)

[@jaygandy-simpson9701]

А что уже начали рекуртить на ютубе?

[@dsalodki]

я помню делал таблицу из div она при изменении окна меняла размеры ячеек

[@YauhenKavalchuk]

Тоже делал)

[@iGotton]

+

[@YauhenKavalchuk]

👍

[@ivanpizdirvan6625]

Я таблицу на гридах делаю😀

[@YauhenKavalchuk]

👍

[@rmstr7]

Кто из 2022 ?)

[@YauhenKavalchuk]

🤔

[@avinadevil]

Как сделать текст в теге: Заголовок (жирным) ? Как сделать текст посередине в объединенных ячейках: Хочу быть по середине ячейки ? P.s. Да, это "Гуглится", но ты просил комментарий!

[@NONAME-ko5zn]

Взломай игру Аватария

[@YauhenKavalchuk]

🤦‍♂️

[@dmitrijponkin]

Большое спасибо!