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