Полное описание примера расчёта фона ячеек
На диаграмме показаны шесть накладывающихся "слоёв" табличной модели CSS. Они иллюстрируют алгоритм расчёта окончательного фона ячеек.
Шесть слоёв размечены как прямоугольники, обозначающие приоритет, расположенные один над другим в трёхмерном пространстве (т.е. слои изображены в виде ромбов, чтобы дать представление о 3-мерном пространстве).
Прямоугольники (ромбы) представляют, сверху вниз: ячейки, ряды, группы рядов, столбцы, группы столбцов и саму таблицу.
На диаграмме видно, что, если смотреть сверху вниз на слои, то можно высчитать цвет фона каждой ячейки. На верхнем слое каждая ячейка, специфицирующая слой, показана как серый бокс с чёрной рамкой. Ячейка без чёрного фона в верхнем слое обозначает "окно" в нижележащие слои, которые определяют конечный цвет.
Это же правило действует для всех последующих слоёв: ряд без фона - окно в слой группы рядов и т.д.