【案例篇4】HTML+CSS实现漂亮的套餐价格表页面演示(源码)

前言

        随着前端技术的不断发展与进步，界面交互的样式要求和美感也越来越高，很多网页的交互都加上了css动画,这里作者给大家分享一个前端开发必掌握的漂亮的套餐价格表，赶紧学起来吧，直接拿到直接自己商城系统中展示商品价格套餐使用，简洁又大方。

---

漂亮的套餐价格表页面演示

        

        这是一款漂亮的套餐价格表，使用波浪将价格和服务项进行分割，波浪由 svg 制作，当鼠标进入时有动画效果。详细的服务项演示默认为 3 条，可自由增加。

1.Html构建

代码如下（示例）：

        <div class='pricing-item'>
                <div class='pricing-deco'>
                    <svg class='pricing-deco-img' enable-background='new 0 0 300 100' height='100px' id='Layer_1'