[Примечание: для тех, кто может путать этот вопрос с «почему бы не использовать таблицы для разметки HTML», я не задаю этот вопрос. Вопрос, который я задаю, заключается в том, почему макет сетки принципиально отличается от макета таблицы.]

Я изучаю библиотеки CSS (в частности, Bootstrap) для проекта. Я скорее программист, чем веб-дизайнер, и я чувствую, что могу извлечь выгоду из библиотеки, которая заключает в себе хороший дизайн.

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

Другими словами, что такоефундаментальный Разница между этими двумя примерами HTML? Я ошибаюсь, думая, что макет сетки - это просто таблица с другим именем?

<div class="row">
    <div class="span16"></div>
</div>

<div class="row">
    <div class="span4"></div>
    <div class="span4"></div>
    <div class="span4"></div>
    <div class="span4"></div>
</div>

а также

<table>
  <tr>
    <td colspan=4></td>
  </tr>
  <tr>
    <td></td>
    <td></td>
    <td></td>
    <td></td>
  </tr>
</table>