样式面板可以几乎只需鼠标拖拉拽就可以对页面进行可视化设计，并在对应选择器下生成CSS。
样式面板支持各种常见的样式可视化操作，对于少量还未支持的CSS语法（如calc()函数）可以直接在CSS栏中编写，两边操作是等效的。
基本操作请观看右侧教学视频。
如果不设置任何选择器时进行的可视化设计生成的CSS是以当前动态id作为选择器的，生成CSS在CSS栏的组件中查看，也可以直接在那里添加各种伪类，如:after, :active等。
对于复杂的、长久运营的项目应优先考虑设置有意义的选择器。通常是先给当前组件写个类名，再在CSS栏的页面中写个能选中当前组件的选择器，回到样式面板就可以在此选择器下进行可视化设计了。
如果使用了共享组件，也可以在共享组件的CSS栏中设置选择器，那就会在此共享组件中生成CSS并作用到所有使用到此共享组件的页面中。
CSS变量可分成4种类型
color：颜色
unit：带有单位的值，如width: 9px
number：不带单位的值，如opacity: 0.8
text：非数值，如cursor: pointer
设置好CSS变量后再随后的可视化设计时就可以选用。