Silex项目v3.3.1-1版本发布：增强CSS选择器与布局功能

Silex是一个开源的网页设计工具，它允许用户通过可视化界面创建响应式网站，而无需编写代码。该项目采用了GrapesJS作为核心编辑器，并在此基础上扩展了大量实用功能，使网页设计变得更加直观和高效。

最新发布的v3.3.1-1版本为Silex带来了多项重要更新，主要集中在CSS选择器管理和布局功能的增强上。这些改进使得设计师能够更精确地控制页面元素的样式和行为，同时也提升了设计系统的复用性。

高级CSS选择器管理

新版本引入了强大的高级选择器管理系统，它支持复杂的CSS选择器语法，包括：

• 状态选择器（如.card:hover）
• 层级选择器（如section > ul li.active）
• 组合选择器

这一功能使得设计师能够直接在可视化界面中创建和管理复杂的CSS规则，而无需手动编写代码。当页面组件发生变化时，相关的选择器会自动更新，保证了样式的一致性。

新增CSS属性支持

v3.3.1-1版本扩展了对现代CSS属性的支持，主要包括以下几类：

滚动捕捉(Scroll Snap)属性

• scroll-snap-type
• scroll-snap-align
• scroll-padding

这些属性使得创建具有精确滚动停止点的界面变得更加容易，特别适合构建图片轮播、幻灯片或分页内容等交互元素。

Flexbox布局增强

新增了对Flexbox项目属性的支持：

• flex-grow
• flex-shrink
• order

这些属性让设计师能够更精细地控制Flex容器内项目的伸缩行为和排列顺序，实现更灵活的布局方案。

其他布局属性

版本还增加了对以下属性的支持：

• 文本处理：white-space、text-transform、text-overflow、hyphens
• 溢出控制：overflow-y
• 多列布局：columns、column-gap、column-span

符号(Symbols)系统改进

Silex对GrapesJS的符号功能进行了升级，现在使用官方的Symbols API。这一改进使得：

• 设计系统的复用更加可靠
• 符号实例与主符号的同步更加稳定
• 整体性能得到提升

符号功能允许设计师创建可复用的组件（如页眉、页脚或导航栏），并在整个网站中保持一致的外观和行为。当修改主符号时，所有实例都会自动更新。

技术实现细节

在底层实现上，这些新功能主要依赖于几个关键包的更新：

• 高级选择器管理通过grapesjs-advanced-selector插件实现
• 符号功能基于grapesjs-symbols插件构建
• 核心框架silex-lib进行了相应调整以支持这些新特性

这些更新共同构成了Silex v3.3.1-1版本的核心改进，为网页设计师提供了更强大的工具集，同时也为后续的功能开发奠定了基础。

对于想要体验这些新功能的用户，可以通过预发布环境进行测试。开发团队也欢迎用户反馈使用体验和发现的问题，以帮助进一步完善产品。