A CSS integration model for declarative 3D

Abstract

Declarative 3D (Dec3D) implementations, most notably XML3D and X3DOM, have enabled a seamless integration of 3D and 2D content on the same web page. Yet one of the major web technologies, Cascading Style Sheets (CSS), has not been integrated. The usage of CSS for 3D content has always been envisaged but never fully approached, because only polyfills for declarative 3D implementations exist and only recent developments have made custom CSS properties available. In this paper we will present a deep integration and adaption of CSS for Dec3D content and, hence, provide the final component necessary to fully integrate 3D content into the web technology stack. Our integration model allows for appearance definitions, such as visibility and materials, at a novel level of expressiveness. CSS-Selectors, inheritance, as well as media types provide unique means to change a scene's final appearance in a flexible and powerful way. Using CSS, it is possible to define the appearance of a 3D object dependent on the DOM hierarchy position or the screen resolution and orientation without a single line of JavaScript. The integration of CSS further enables the use of browser debugging facilities that have not been usable before. Because the requirements of 3D content are different compared to those of 2D content, we will point out existing limitations and necessary future additions to improve the interoperability of CSS with 3D content.