10. HTML таблицы - теги table, tr, td и th. Структурные табличные теги thead, tbody, tfoot и caption

Поделиться
HTML-код
  • Опубликовано: 27 ноя 2024

Комментарии • 48

  • @Ivanfwit
    @Ivanfwit Год назад +4

    верно подмечено, что сначала нужно вспомнить как объединять, чтобы набрать темп при работе с таблицами)

  • @ВихроваИрина
    @ВихроваИрина Год назад +5

    Спасибо за видео. Отличная короткая напоминалка по табличным тегам. Сейчас столкнулась с версткой email писем, пересмотрела, чтобы вспомнить :)

  • @gvitoss
    @gvitoss Год назад +2

    Спасибо за простоту и доходчивость

  • @АнастасияДубинина-э9и

    Интересно было узнать.

  • @alexb.2616
    @alexb.2616 Год назад +1

    Не знал про tfoot. Спасибо!

  • @doker2144
    @doker2144 Год назад +3

    Урааа 🎉🎉🎉 наконец-то годный контент

  • @propilen3
    @propilen3 4 месяца назад

    ахаха. Спасибо за экскурс. Немного изучал веб-разработку в 2002-2007 гг. Действительно таблицами все верстать приходилось. Еще и в разных браузерах "швы" по-разному отображались. :)))

  • @ЯшаБаратов
    @ЯшаБаратов 3 месяца назад +1

    Спасибо

  • @ЕвгенийУсачев-р5ж
    @ЕвгенийУсачев-р5ж Год назад +3

    Топ контент

  • @lenurabdiramanov8055
    @lenurabdiramanov8055 Год назад +1

    Чем-то напоминает Excel, если ты веб-разработчик и тебе лень открывать Excel, то хорошая альтернатива 😆

  • @ukraine1514
    @ukraine1514 7 месяцев назад +1

    Поклончик👍

  • @iv.mashhka
    @iv.mashhka 3 месяца назад +1

    просто отличный курс, благодарю! только встает вопрос практики, где вот можно потренироваться?

    • @AleksanderLamkov
      @AleksanderLamkov  3 месяца назад +1

      Практиковаться сугубо в HTML - это такое себе, а вот со связкой "HTML + CSS" уже можно.
      Ищешь простой макет для Figma и верстаешь.
      В самом начале с наскока всю страницу целиком будет сделать сложно, поэтому надо начинать с маленьких кусочков, буквально кнопочек, полей ввода, небольших карточек, а затем собирать всё по кусочкам в блоки побольше.

  • @behzodboy
    @behzodboy 5 месяцев назад +1

    Здравствуйте подскажите почему то у меня не выводится таблица ? Или тег не работает не понимаю

    • @AleksanderLamkov
      @AleksanderLamkov  5 месяцев назад

      Привет! Скорее всего что-то не так написал в HTML-файле.
      Можешь написать в наше сообщество в телеграмме и скинуть свой код, тебе помогут:
      t.me/friendlyFrontendChat

  • @GekaLeonov
    @GekaLeonov 6 месяцев назад

    В браузере Опера, кстати таблица получается без обводки (по умолчанию).

  • @DkyarbekAnvarov
    @DkyarbekAnvarov 2 месяца назад +1

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

    • @AleksanderLamkov
      @AleksanderLamkov  2 месяца назад +1

      Напиши в чат, там помогут:
      t.me/friendlyFrontendChat
      Можешь сразу архивом скинуть свой код, так будет быстрее.

  • @АлександрНевский-п3х1т
    @АлександрНевский-п3х1т 2 месяца назад

    начал этот курс несколько дней назад.Но как все это запомнить?Или главное это понять как это работает а на практике само придет?

    • @AleksanderLamkov
      @AleksanderLamkov  2 месяца назад +1

      Запомнить всё и сразу - невозможно, но это от тебя и не требуется. Этот курс тебе показывает на что CSS способен. Твоя задача - впитать по-максимуму что сможешь, параллельно с просмотром видеороликов писать самостоятельно код, экспериментировать со свойствами и подходами. После окончания этого курса - смотри мастер-класс и / или остальные видосы на канале, которые выходили после курса CSS. Все они идут в правильной последовательности в плане возрастания сложности.

  • @АнтонТерешков-э7ф
    @АнтонТерешков-э7ф 5 месяцев назад +1

    У меня тоже сетку таблицы не видно, это связано с браузером или в видео сетка сделана с помощью css?

    • @AleksanderLamkov
      @AleksanderLamkov  5 месяцев назад

      Свои стили не добавлял. Это браузерные, в Chrome.

  • @УзналМолодец
    @УзналМолодец Месяц назад

    А как манипулировать расположением таблицы на сайте, кроме центра, правого и левого края? Например хочу в правом верхнем углу.

    • @AleksanderLamkov
      @AleksanderLamkov  Месяц назад

      Позиционирование в современной верстке делается силами CSS и flex / grid механиками.
      В конкретном случае - нужно родительскому элементу над задать display flex и justify-content end.

  • @GekaLeonov
    @GekaLeonov 6 месяцев назад

    Привет. А как часто html таблицы применяются в верстке?

    • @AleksanderLamkov
      @AleksanderLamkov  6 месяцев назад

      Привет! В макетах более сложных, чем лендинг, встречаются таблицы и в разметке их нужно делать через соответствующие теги. Базовые теги (table, tr, td и th) знать точно надо, а вот объединять ячейки - это пореже приходится делать, поэтому можно не заострять на этом внимание.

  • @АнтонТерешков-э7ф
    @АнтонТерешков-э7ф 5 месяцев назад

    th ещё централизует заголовок😉
    caption в видео отцентрализовался, у меня нет:)

  • @marytes7478
    @marytes7478 5 месяцев назад

    Почему не было рассмотрено col и colgroup?

    • @AleksanderLamkov
      @AleksanderLamkov  5 месяцев назад

      Потому что это избыточная информация. Эти теги нужны для обеспечения сложной семантики. Для новичков достаточно тега th для схожей цели.

  • @hermaeuusmora
    @hermaeuusmora Год назад

    Учить начал недавно и сейчас не совсем понимаю от куда появились грани таблицы без атрибута border?

    • @AleksanderLamkov
      @AleksanderLamkov  Год назад +2

      Привет! Браузеры по умолчанию всем таблицам, элементам , добавляют собственные границы. Если они мешают (а они мешают в большинстве случаев), то их можно сбросить, применив в стилях к таблице свойство border-collapse: collapse.

    • @hermaeuusmora
      @hermaeuusmora Год назад

      @@AleksanderLamkov у меня Microsoft Edge и никаких граней без border не было

    • @AleksanderLamkov
      @AleksanderLamkov  Год назад

      Может все же невидимые есть? Обычно 1px между всеми ячейками добавляются. Если их нет, значит это особенность Edge. Но в любом случае - лучше добавлять border-collapse: collapse, чтобы наверняка от них избавиться.

    • @hermaeuusmora
      @hermaeuusmora Год назад

      @@AleksanderLamkov как я понимаю этот атрибут устаревший и границы добавлять стоит через css?

    • @AleksanderLamkov
      @AleksanderLamkov  Год назад +1

      Угу, лучше через CSS.

  • @AzizaxonTurgunova-x7y
    @AzizaxonTurgunova-x7y 2 месяца назад

    что делать если тег "table" не работает на html я не понимаю с чем проблема можете помочь

    • @AleksanderLamkov
      @AleksanderLamkov  2 месяца назад

      Напиши сюда:
      t.me/friendlyFrontendChat
      Тебе помогут.

  • @MentorOfMentors
    @MentorOfMentors 3 месяца назад

    Расчетный лист

  • @Mogo_Bol
    @Mogo_Bol 23 дня назад

    Не получилась таблица, просто текст в столбик

    • @AleksanderLamkov
      @AleksanderLamkov  23 дня назад

      Напиши в чат, помогут разобраться:
      t.me/friendlyFrontendChat

  • @Libertarianrool
    @Libertarianrool 6 месяцев назад

    такая хорошая подача и контент, но музыка... она меня усыпляет прям

    • @AleksanderLamkov
      @AleksanderLamkov  6 месяцев назад +3

      Музыки не будет примерно с 14-15 урока этого курса и во всех последующих видео на канале.
      А ведь поначалу мне казалась эта идея хорошей 😅