系统设计器采用html5技术开发，主要元素采用div层关系处理，通过ul标签，ol标签，li标签，p标签，span标签，label标签，table标签，h1到h6标题标签，做细化元素；

首先，我们先介绍div层关系标签的class类命名方法。

z_con:系统的框架层，也是系统的最外层，也可以方便元素和模块的管理，系统的云框架就是由该层组成。

z_row:系统的行，有点类似于框架层的子框架层；

z_col:系统的列，主要作用是间内容分割成不同的分块，它采用目前最新的12个网格形式组成，可通过列来分割出不同比例的内容进行填充，并做不同端口和布局的展示效果。

z_mod:系统的模块层，也是系统层应用最多的元素，系统的模块可以做不同的功能，比如做图文展示，图片展示，文章的展示，还可以做文章列表，产品列表等列表输出功能。模块也可以做很多特效的展示，比如：动态背景，打字特效，动画特效，杂志展示，全景展示，地图显示，全屏切换等；

注：以上模块都带有自己的样式，可以在不同的布局中设置自己单独的样式。

细化元素介绍：

细化元素与层元素最大的差别在于细化元素正常情况下没有自己单独的样式，所以细化元素最大的特点是它可以做批量的样式处理，比如列表的处理；

所以细化元素我们也会按照网页标准来进行特定的处理，让网站更符合开发标准。