Мобильный оптимизировать веб-сайт на основе таблицы?

Question

Мне было поручено оптимизировать мобильный сайт с медиазапросами для загрузки определенных CSS в более узких браузерах. Однако я только что заметил, что сайт построен с использованием таблиц, не соответствующих CSS. Я знаю все причины, по которым создание сайта с таблицами - ужасная идея, но есть ли способ обойти эту проблему, которая позволит мне разбить таблицу на макет одного столбца с помощью CSS?

Answer 1

Это может быть сложной задачей.

В зависимости от того, на какие мобильные браузеры вы нацеливаетесь, и в зависимости от используемой наценки (есть ли другие таблицы?и т. д.), тогда я бы предложил установить свойство display для TD макета, чтобы блокировать его, чтобы позволить вам освободить их от ограничений таблицы.

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

table, tr, td {
    display: block;
}

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