{
"summary": "已为He

{
"summary": "已为Hero组件添加了精美的渐变遮罩效果，从深色到透明的渐变增强了背景图片的视觉层次，同时保持了文字的可读性和组件的现代感。",
"widget": {
"type": "custom-template",
"isAPI": false,
"fullWidth": true,
"html": "<div class=\"relative py-16 md:py-24 lg:py-32 overflow-hidden bg-cover bg-center\" style=\"background-image: url('/assets/images/16-9/business-01.jpg')\">\n <div class=\"absolute inset-0 bg-gradient-to-r from-gray-900 via-gray-900/80 to-transparent\"></div>\n <div class=\"container relative z-10 mx-auto px-4 md:px-6\">\n <div class=\"flex flex-col lg:flex-row items-center justify-between gap-10 lg:gap-16\">\n <div class=\"flex-1 text-center lg:text-left\">\n <h1 class=\"text-4xl md:text-5xl lg:text-6xl font-bold text-white leading-tight mb-4\">\n 开启您的数字之旅\n </h1>\n <p class=\"text-lg md:text-xl text-gray-200 mb-8 max-w-2xl mx-auto lg:mx-0\">\n 我们提供创新的解决方案，帮助您的业务在数字时代脱颖而出。专业团队，卓越服务，助力您的成功。\n </p>\n <div class=\"flex flex-col sm:flex-row gap-4 justify-center lg:justify-start\">\n <a href=\"#\" class=\"inline-flex items-center justify-center px-6 py-3 text-base font-medium text-white bg-blue-600 rounded-lg shadow-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition-colors\">\n 立即开始\n </a>\n <a href=\"#\" class=\"inline-flex items-center justify-center px-6 py-3 text-base font-medium text-white bg-transparent border border-white rounded-lg shadow-sm hover:bg-white hover:text-gray-900 focus:outline-none focus:ring-2 focus:ring-white focus:ring-offset-2 transition-colors\">\n 了解更多\n </a>\n </div>\n </div>\n <div class=\"flex-1 flex justify-center lg:justify-end\">\n <div class=\"relative w-full max-w-md\">\n <img src=\"/assets/images/illustration/01.png\" alt=\"数字解决方案插图\" class=\"w-full h-auto object-contain\">\n </div>\n </div>\n </div>\n </div>\n</div>"
},
"next": ["添加微动画效果", "实现视差滚动", "优化移动端响应", "添加视频背景选项", "集成表单订阅功能"]
}