需求原型：自定义 HTML 可视化编辑器

公告栏

单页页头

自定义Html

百货商品详情

自定义Html

+ 添加模块

页脚

自定义Html 可视化编辑

HTML 代码内容

<section style="background:#000; color:#fff; padding:60px; text-align:center;">
    <div style="max-width:800px; margin:0 auto;">
        <h1 style="font-size:42px; margin-bottom:20px; font-weight:800;">HIGHLY CONCENTRATED RUST REMOVER</h1>
        <p style="font-size:16px; color:#999; margin-bottom:32px;">Designed for steel, iron, and aluminum alloys, it instantly dissolves rust.</p>
        <img src="https://images.unsplash.com/photo-1518770660439-4636190af475?auto=format&fit=crop&w=800" style="width:100%; border-radius:12px; margin-bottom:30px;">
        <button style="background:#4a68ff; color:#fff; padding:15px 40px; border:none; border-radius:6px; font-size:16px; font-weight:bold; cursor:pointer;">BUY NOW GET 50% OFF</button>
    </div>
</section>

交互入口 (Entry)

可视化模式规则